hisasann / typescript-nuxtjs-boilerplate

Deprecated: :bento: Nuxt.js with TypeScript and Run with docker and docker-compose

This repository has been moved to:

https://github.com/typescript-nuxtjs-boilerplate/typescript-nuxtjs-boilerplate

🍱 typescript-nuxtjs-boilerplate

example url: https://typescript-nuxtjs-boilerplate.netlify.com/example

---

💾 Install

Note: requires node version >= 8.10.0 and npm version >= 5.6.0

First, clone the repo via git:

$ git clone --recursive [email protected]:hisasann/typescript-nuxtjs-boilerplate.git

Install yarn

for mac

$ brew install yarn

for windows

Use installer

Install dependencies

Using yarn:

yarn install

Using npm:

npm install

Run sample server at localhost:5000

$ node ./tools/server.js

🔌 Serve with hot reload at localhost:4000

$ yarn run dev

or

$ yarn run local

and run mock server for examples

$ node ./tools/server.js

Build for production on docker and launch server

$ yarn run build:docker
$ yarn start

Build for production and SPA mode

$ yarn run build:static

It will be published in the dist directory

For detailed explanation on how things work, checkout Nuxt.js docs.

📘 Example Links

• /example root directory
• sign-in
  • nuxt/example-auth0: A simple example that shows how to use Nuxt.js with Auth0.
• sign-out
• ajax color(pattern1)
  • Introduction - Axios Module
• ajax schema(pattern2)
• post custom http headers
• routing custom path(pattern1)
• routing custom path(pattern2)
• assets and static
• basic todo example
• vue life cycle
• use plugin
  • プラグイン - Nuxt.js
• custom head tag
• async custom head tag
• send http api in vuex
• get parameters
• image lazy load
  • hilongjw/vue-lazyload: A Vue.js plugin for lazyload your Image or Component in your application.
  • Nuxt.jsでdata-src='~assets/lemon-sour.png'をrequire変換する方法 - DJ lemon-Sour's diary (prod.hisasann)
• extend css class
• external include file
• dynamic import
• using user agent on ssr and csr
• i18n
  • kazupon/vue-i18n: Internationalization plugin for Vue.js
• animation - animejs
  • juliangarnier/anime: JavaScript animation engine
• now utc offset with moment
  • moment/moment: Parse, validate, manipulate, and display dates in javascript.
• vue-carousel
  • SSENSE/vue-carousel: A flexible, responsive, touch-friendly carousel for Vue.js
• vue-awesome-swiper
  • surmon-china/vue-awesome-swiper: 🏆 Swiper component for @vuejs
• audio
• video
  • Nuxt.jsでvideoタグを使うときのfile-loader奮闘記 - DJ lemon-Sour's diary (prod.hisasann)
• server-side-set-cookie
• type safe vuex
  • TypeScript annotation
• counter with typesafe
  • @lollipop-onl/vuex-typesafe-helper - npm

📚 Docs

See our docs and guides here

⚙️ Maintainers

• hisasann

🍜 License

MIT © hisasann