Giter Site home page Giter Site logo

hartl3y94 / vuenode-fullstack Goto Github PK

View Code? Open in Web Editor NEW

This project forked from asadsahi/vuenode-fullstack

0.0 0.0 0.0 802 KB

Vue.Js & Node fullstack Single Page Application with Relational databases as backend using Sequelize. Live Demo:

Home Page: https://vuenode-fullstack.herokuapp.com/

License: MIT License

JavaScript 70.19% Vue 12.74% HTML 2.43% CSS 13.90% TSQL 0.52% Dockerfile 0.21%

vuenode-fullstack's Introduction

Vue Node Fullstack

Fullstack application built using Vue and NodeJs with server side rendering.

Features

  • Full features SPA + PWA with SSR
  • Frontend (Vue)
  • Backend (Express)
  • ORM (Sequelize)
  • DB (All databases supported by sequelize e.g MySql, MSSql, Sqlite, PostgreSQL)
  • Login & Registration features
  • JWT based authentication
  • Server Side Rendering
    • Vue + vue-router + vuex working together
    • Server-side data pre-fetching
    • Client-side state & DOM hydration
    • Automatically inlines CSS used by rendered components only
    • Preload / prefetch resource hints
    • Route-level code splitting
  • Progressive Web App
    • App manifest
    • Service worker
    • 100/100 Lighthouse score
  • Single-file Vue Components
    • Hot-reload in development
    • CSS extraction for production
  • Animation
    • Effects when switching route views
  • Unit testing
  • E2E testing
  • Examples
    • Read to roll examples for any project

Architecture Overview

screen shot 2016-08-11 at 6 06 57 pm

A detailed Vue SSR guide can be found here.

Build Setup

Requires Node.js 8+

# install dependencies
npm install # or yarn

# serve in dev mode, with hot reload at localhost:3000
npm run dev # or yarn dev

# build for production
npm run build:prod # or yarn build:prod

# serve in production mode
npm start # or yarn start

# serve through ngrok tunnel
# Details: (this gives an external url to browse from internet for the purpose of testing while developing locally without deploying to server)
## Dev
npm run dev:tunnel # or yarn dev:tunnel
## Prod
npm run prod:tunnel # or yarn prod:tunnel

# run unit tests
## single run
npm test # or yarn test
## watch mode
npm run test:watch # or yarn test:watch

# end-to-end tests
# start server
npm run dev # or yarn dev

## single run
npm run e2e # or yarn e2e
## watch mode
npm run e2e:watch # or yarn e2e:watch

Credist

Kudos to vue-hackernews-2.0 on which this project is based on.

License

MIT

vuenode-fullstack's People

Contributors

asadsahi avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.