MNTN project

Hello there! The MNTN project was realized to practice several interesting features. For instance, I've found it very fascinating for myself to try to make scroll parallax effect. The MNTN template by Kryston Schwarze turned to be suitable for my demand. This project is based on Gulp4 ;)

You can see the project's preview on Behance;

The things I used in this project:

• GULP 4;
• PUG;
• SASS/SCSS;
• JQUERY;

This is main stack, but this work also includes things like:

• Mixins and other pug features;
• Popular libs for some cases (e.g. progressive images);
• SVG-sprites;
• Simple animations;
• Cool favicons;
• Eslint;

Folder structure:

root
├── dist
│   └── // here we placed production files
├── gulp
│   └── // main gulp4 template files
├── src
│   ├── css
│   ├── favicon
│   ├── fonts
│   ├── img
│   ├── js
│   ├── libs
│   ├── pages
│   │    └── // .pug files are placed here
│   ├── sass
│   │    └── // preprocessor stylesheet files before compiling
│   └── scripts
│        └── // our main scripts that builds with gulp-babel, uglify, etc.
├── .eslintrc.js
├── .gitignore.js
├── .prettierrc
├── gulpfile.js
└── package.json

How to check it

1. You can visit GitHub Pages by following this link;
2. You can clone or download this repo and simply install all dependencies and open this project locally; 2.1. Use this command in opened root folder:

npm i

2.2. Wait for downloading; 2.3. Start it via:

npm run start

Thanks for watching! Hope you enjoyed my skills-training pet-project ;)