The project aimed to fulfill the front-end part of my full-stack web development course requirements using HTML, CSS and JS (The Client-Side Of The Web). I used Gridsome by personal choice, a free and an open-source Vue.js powered framework, a Vue-powered static site generator (model–view–view model: MVVM - software architectural pattern) for building the user interface and single-page application.
Webpack is the module bundler used and its main purpose is to bundle JavaScript files for usage in a browser, yet it is also capable of transforming, bundling, or packaging.
Modules used:
- postcss-scss a SCSS parser for PostCSS;
- stylelint mighty, modern linter that helps you avoid errors and enforce conventions in your styles;
- vue-svg-loader enables the use of SVG files as Vue components;
Netlify who's connected to my GitHub repository pulling my source code) was used to deploy and host my project website.
To visit, click here.
- Clone the repository:
$ git clone https://github.com/aamorimsimoes/Frontend-Project.git- Install npm dependencies:
$ npm install- Run this command inside the project directory to start a local development server. The server will start at http://localhost:8080/
$ gridsome develop- (Extra) Run this command to start GraphQL Playground and explore schema or data. Open your browser and go to http://localhost:8080/___explore ;
$ gridsome explore