/web-design

Web-design course for the minor 'web-development'

Primary LanguageJavaScriptMozilla Public License 2.0MPL-2.0

Kager.io - The personal website of Bas Kager

kager.io

A NodeJS/Express project Kager.io screenshot

Directory structure

project
│
└───docs - Documentation
│
└───app - Root of the NodeJS application
│   │
│   │   README.md
│   │   LICENSE
│   │   .eslintignore
│   │   eslintrc.js         - Configuration for the linter/formatter
│   │   .gitignore
│   │   app.js              - App starting point / Express server
│   │   config.example.js   - Example config, configure your settings and  rename to config.js
│   │   gulpfile.js         - Tasks for the Gulp task runner
│   │   package-lock.json
│   │   package.json        - NPM Packages
│   │
│   └───assets              - Uncompressed/untreated front-end assets
│   └───classes             - Classes used throughout the application
│   └───controllers
│   └───public              - Publically exposed files
│   │   │
│   │   │   browserconfig.xml
│   │   │   favicon.ico
│   │   │   manifest.json
│   │   │   browserconfig.xml
│   │   │   sw.js           - Service worker
│   │   │
│   │   └───static          - Static files generated by Gulp such as styling and front-end javascript
│   │
│   └───routes              - Routes for all possible pages
│   └───storage
│   │   │
│   │   │   categories.json - Collection of categories used in the portfolio
│   │   │   projects.json   - Collection of projects shown in the portfolio
│   │   │
│   │   └───cache
│   └───views

Configuring the application

Rename config.example.js to config.js.

  cd /app/
  mv config.example.js config.js

Now you can configure the entries in the configuration file. The file is automatically ignored by GIT so it doesn't accidentally get pushed.

Tips

  • Make sure to set the environment correctly
  • Don't forget to set mailer.smtp.secure to true on production
  • The sentry endpoint can be configured to enable external monitoring through Sentry.io.
  • It is recommended to use an external mail service such as sendgrid.com, SMTP details can be configured under mailer.smtp.
  • If you change the formMapper prefix (a prefix for custom HTML attributes belonging to the FormMapper), you also need to change the attributes in the view files and the front-end JavaScript files.

Install packages

Run the following in /app/:

npm install

Build the application

During development

This runs in the background and will make sure the front-end assets are up-to-date in /public/

Run the following in /app/:

gulp watch

On production

This minifies and compresses the front-end source files. May take up to a while due to scaling and compressing images.

Run the following in /app/:

gulp build

Start the application

Development

Requires the nodemon package to be installed

npm run start-dev

Production

Requires the forever package to be installed

npm run start-prod