nextjs-webapp-boilerplate

This is a WebApp boilerplate project based on Node.js platform, use Next.js,React.js,Express.js,Ant-design,ES6,webpack to build,using jest to do unit testing. This site includes some common components such as Header,Footer,Nav,BreadCrumb,Sidebar or GridList,and some pages which could be visit without login, and some other pages which could be visit after login.

I made a simple login auth use express-session,all auth-based pages extends BasePage to validating session and user state, if not, it will redirect to login page, you can login using ID: test@test.com with sixes 1 password.

  $ git clone git@github.com:aeron11/nextjs-webapp-boilerplate.git
  $ cd nextjs-webapp-boilerplate
  $ npm install
  $ npm run dev
  

Run test for unit-test

  $ npm run test

Run build for production

  $ npm run build
  $ npm run start

Related features

• Node
• Express
• Next
• express-session
• connect-redis
• React
• ES6
• Sass
• Ant-Design
• Babel
• webpack
• jest
• Istanbul
• enzyme

project structure

.
├── .babelrc                  # Configures Babel
├── .editorconfig             # Configures editor rules
├── .gitignore                # Tells git which files to be ignored
├── .next                     # Next.js built folder
├── README.md                 # This file.
├── package.json              # Package configuration. The list of 3rd party libraries and utilities
├── components                # components
│   ├── Common                # Common  components 
│   ├── List                  # List components  
│   ├── BasePage              # BasePage for auth session management
├── docs                      # related docs
├── layouts                   # page layout
│   ├── Layout                # user related layout  
│   ├── Main                  # home page layout  
├── pages                     # all page which can be visited
│   ├── auth                  # user auth related pages  
│   ├── list                  # list related pages  
│   ├── web                   # web pages  
│   ├── user                  # user information pages  
│   ├── _error.js             # error page
├── schema                    # data schema
├── services                  # contains all service logic and apis
├── static                    # static resources
│   ├── images                # for images
│   ├── style                 # for css
│   ├── favicon.ico           # site favicon.ico 
├── tests                     # unit test
│   ├── mocks                 # mock data folder
│   │   ├── data.json         # mock data file
│   ├── unit                  # unit test folder contains test files 
├── utils                     # utils
│   ├── Session               # manage session
├── evn-config.js             # evn config
├── next.config.js            # next.js config
└── server.js                 # app start file

system infrastructure

---