JavaScript Practices

These projects have been prepared from scratch after watching the Build 15 JavaScript Projects - Vanilla JavaScript Course created by John Smilga.

Projects

1. Color Flipper
2. Counter
3. Reviews
4. Navbar
5. Sidebar
6. Modal
7. Questions
8. Menu
9. Video-Preloader
10. Scroll-Mobile Menu Toggle with Dynamic Height, Fixed Header, Scroll Top Button, Smooth Section Scroll, Current Time on Footer
11. Tabs
12. Countdown
13. Lorem Ipsum Generator
14. Todo App-Grocery Bud
15. Slider

Demo website

Project Structure

All source codes are located under the src folder. Home folder is the index page where the project links are listed. The source codes of the projects are located under the projects folder with their own names.

The structure for each project and home is as follows:

css / main.css file is created from main.scss file which is inside the scss folder. main.scss file is used to import the other scss files. CSS codes of the index page are included in the scss / pages.

LiquidJS is used as a template engine. Files of the template are in the views folder.

Installation

git clone https://github.com/hey-fk/javascript-practices
cd javascript-practices
npm install or yarn install

Start the server

gulp

Now enter localhost:3000 in the address bar of your browser.

Dist Folder

gulp dist

Production files will be prepared in /dist folder.

Deploy Vercel

Build Command

gulp dist

Output Directory

dist

Contributing

Did you found a bug or got an idea for a new feature? Feel free to use the issue tracker to let me know. Or make directly a pull request.

Credits

Build 15 JavaScript Projects - Vanilla JavaScript Course by John Smilga

License

This repo is released under the MIT License.