Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/feathers-nuxt/template-app
Batteries included template for full stack feathers and nuxt apps
https://github.com/feathers-nuxt/template-app
Last synced: 12 days ago
JSON representation
Batteries included template for full stack feathers and nuxt apps
- Host: GitHub
- URL: https://github.com/feathers-nuxt/template-app
- Owner: feathers-nuxt
- Created: 2018-04-12T08:51:48.000Z (over 6 years ago)
- Default Branch: master
- Last Pushed: 2018-12-13T08:00:14.000Z (almost 6 years ago)
- Last Synced: 2023-09-19T05:57:35.756Z (about 1 year ago)
- Language: JavaScript
- Homepage: https://feathers-nuxt.netlify.com/
- Size: 298 KB
- Stars: 21
- Watchers: 5
- Forks: 3
- Open Issues: 2
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
- awesome-feathersjs - Feathers + Nuxt Sao Template
README
This is a [sao](https://saojs.org/) template enabling you to scaffold a feathers+nuxt app in seconds. See documentation [site]( https://feathers-nuxt.netlify.com/) for available features.
**THIS IS ALPHA, BE CAREFUL**
I'm also VERY interested in feedback / PRs, so send them my way or email me!
## Quick Start
Use npx, if you do not have sao installed. npx comes bundled with npm version 5.2+.
```bash
npx sao npm:@feathers-nuxt/template-app --update awesome-app
```
You will be prompted to answer a couple of questions to determine how the template should be customized to your needs.
Sao will then clone the template in this repository and put the customized template inside `awesome-app` directory.
If you already have sao installed globally, just invoke it with this template.
```bash
sao npm:@feathers-nuxt/template-app --update awesome-app # downloads template from npm
# sao feathers-nuxt/template-app --update awesome-app # downloads template from github
```
## Installation
You may also use `f3` cli instead of `sao` if you install it globally.
```bash
yarn global add @feathers-nuxt/cli
# npm i -g @feathers-nuxt/cli
f3 init awesome-app
```
> `yarn` is preferred to `npm`, although you may use the later if you so wish.
## Usage
Once your app is initialized, `cd awesome-app` to access your new project.
To start the application in development mode - watch files for changes and reload - run
```bash
yarn dev
```
If you are using an sql database ensure you run `yarn migrate up` to create necessary tables, then `yarn seed` to add test data to the database.
> There are several other **npm scripts** defined in **package.json**. To list them all, invoke `yarn run`
## Features
- SSR ready PWA with offline support.
- User Authentication and Authorization taken care of.
- Logging mixin for Feathers app backed by winston with file and console transports.
- End-to-end, hierarchical, real-time, colorful logs and stories with console and websockets transports.
- Bring your own database or RESTful backend for data storage.
- Database migration and seeding npm scripts included.
- Project build and deployment scripts provided.
- Use any compile to JS langauge supported by webpack: livescipt, coffescript, typescript,
- Use any compile to CSS language supported by webpack: stylus, sass, less,
- Use any compile to HTML language supported by webpack: pug, slim, haml,
- Use HEML markup language for building responsive emails with any compile to HTML language.
- Notifications service for sending all kinds of transactional alerts via emails, SMS, pushes, webpushes or slack
- File uploads service with configurable backing storage: Any store that implements the blob store interface.
- All feathers services automatically available in `vuex` store.
- Namespaced routing to prevent conflict of API and UI routes.
- Optional caching for API routes using Redis on the backend.
- Automatic caching for API routes using feathers-vuex on the frontend.
- Automatic caching for UI routes using workbox runtimeCaching.
- Optional distributed, delayed background job system backed by Redis.
- iView: A high quality UI Toolkit built on Vue.js
- DataTable and DataCard UI components compatible with feathers service endpoints.
### Guide
An application initialized using `f3` will have the following directory stucture.
```text
├── f3.config.js # nuxt & backpack configuration
├── .babelrc # babel configuration to use with backpack
├── .podhook # shell commands to run on remote server during deploy
├── .gitignore # list of file to ignore while deploying to remote server
└── src
├── client # transpiled using nuxt
├── assets # files to transpile with webpack: less, stylus
├── static # files to serve as static resources
├── pages # Vue SFC accessible via a URL
├── components # Vue SFC to use within other SFC
├── layouts # Vue SFC to use for page layout
├── middleware # nuxt renderer middleware
├── modules # nuxt modules
├── plugins # Vue.js plugins
├── store # Vuex store modules
└── utils
├── initClient.js # creates feathers client for server and client bundle
├── initAuth.js # autheticate and populate store with user object
└── store
├── modules # modules for vuex
└── plugins # plugins for vuex
└── server # transpiled using backpack
├── config
├── default.yml # settings for development env
├── production.yml # settings for production env
└── production-0.yml # settings for PM2 app instance 0
├── index.ls # entry to initialize both app and api servers
├── app.ls # express server with nuxt middleware and feathers as sub app
├── api.ls # feathers server with socket.io and rest transports
├── api.hooks.ls # configures global api hooks
├── hooks # triggers run during resource access
└──global.ls # configures global api hooks
├── notifications # templates and dispatcher for email, sms, webpush,
├── services # service, schema, model and hooks for resources in db, fs,
└── auth.ls # configures feathers for authentication
└── db
├── orm.ls # configures feathers to use mongoose or sequelize ORM
├── seed.ls # populates database with dummy data
└── migrations # procedures to creates and drop tables
└── middleware
└── nuxt.ls # nuxt middleware for SSR
```