├── .gitignore ├── README.md ├── package-lock.json ├── package.json ├── run_sass.sh ├── src ├── app.js ├── assets │ └── sass │ │ ├── commons │ │ └── main.scss │ │ └── style.scss ├── css │ ├── style.css │ └── style.css.map ├── img │ └── favicon.ico ├── index.html ├── service │ └── Utils.js └── views │ └── pages │ ├── errors │ └── Error404.js │ ├── home │ └── Home.js │ └── index.js ├── webpack.common.js ├── webpack.dev.js └── webpack.prod.js /.gitignore: -------------------------------------------------------------------------------- 1 | node_modules 2 | dist -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # Gama Academy :) 2 | ## Template Node FullJS 3 | 4 | Para iniciar o projeto: 5 | `git clone https://github.com/mrdouglasmorais/template-node-fulljs` 6 | 7 | Para instalar as dependências: 8 | `npm i` 9 | 10 | Para iniciar em modo de desenvolvimento: 11 | `npm start` 12 | 13 | ## Aconselhado ter instalado NODEJS versão 14.x em diante. 14 | 15 | Para instalar o node [clique aqui](https://nodejs.org/en/) 16 | 17 | ## Professor Douglas Morais -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "gamaacademy", 3 | "version": "1.0.0", 4 | "description": "Template FullJS", 5 | "main": "index.js", 6 | "scripts": { 7 | "test": "echo \"Error: no test specified\" && exit 1", 8 | "start": "sass --watch src/assets/sass/style.scss:src/css/style.css & webpack serve --open --config webpack.dev.js", 9 | "build": "node-sass src/assets/sass/style.scss > src/css/style.css && webpack --config webpack.prod.js" 10 | }, 11 | "keywords": [], 12 | "author": "Douglas Morais", 13 | "license": "ISC", 14 | "dependencies": { 15 | "axios": "^0.21.1", 16 | "clean-webpack-plugin": "^3.0.0", 17 | "node-sass": "^5.0.0", 18 | "sweetalert2": "^10.15.5", 19 | "webpack": "^5.21.1", 20 | "webpack-dev-server": "^3.11.2", 21 | "webpack-merge": "^5.7.3" 22 | }, 23 | "devDependencies": { 24 | "@babel/core": "^7.12.13", 25 | "@babel/polyfill": "^7.12.1", 26 | "babel-loader": "^8.2.2", 27 | "webpack-cli": "^4.5.0" 28 | } 29 | } 30 | -------------------------------------------------------------------------------- /run_sass.sh: -------------------------------------------------------------------------------- 1 | sass --watch src/assets/sass/style.scss:src/css/style.css -------------------------------------------------------------------------------- /src/app.js: -------------------------------------------------------------------------------- 1 | /** Imports **/ 2 | import Utils from '../src/service/Utils'; 3 | 4 | /** Pages **/ 5 | import { error404, home } from './views/pages/index'; 6 | 7 | /** Routes **/ 8 | let routes = { 9 | '/': home, 10 | } 11 | 12 | const router = async () => { 13 | const root = document.getElementById('root'); 14 | 15 | let request = Utils.parseRequestURL(); 16 | 17 | let parseURL = (request.resource ? '/' + request.resource : '/') + (request.id ? '/:id' + request.id : '') + (request.verb ? '/' + request.verb : ''); 18 | let page = routes[parseURL] ? routes[parseURL] : error404; 19 | 20 | root.innerHTML = await page.render(); 21 | await page.after_render(); 22 | } 23 | 24 | /**observa mudanças na hash*/ 25 | window.addEventListener('hashchange', router); 26 | 27 | /**oberva carregamento da pagina */ 28 | window.addEventListener('load', router); 29 | -------------------------------------------------------------------------------- /src/assets/sass/commons/main.scss: -------------------------------------------------------------------------------- 1 | *{ 2 | margin: 0; 3 | padding: 0; 4 | } -------------------------------------------------------------------------------- /src/assets/sass/style.scss: -------------------------------------------------------------------------------- 1 | @import "./commons/main.scss"; -------------------------------------------------------------------------------- /src/css/style.css: -------------------------------------------------------------------------------- 1 | * { 2 | margin: 0; 3 | padding: 0; } 4 | 5 | /*# sourceMappingURL=style.css.map */ 6 | -------------------------------------------------------------------------------- /src/css/style.css.map: -------------------------------------------------------------------------------- 1 | { 2 | "version": 3, 3 | "mappings": "AAAA,CAAC;EACC,MAAM,EAAE,CAAC;EACT,OAAO,EAAE,CAAC", 4 | "sources": ["../assets/sass/commons/main.scss"], 5 | "names": [], 6 | "file": "style.css" 7 | } -------------------------------------------------------------------------------- /src/img/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/mrdouglasmorais/template-node-fulljs/952cb8924f655c2ecdc81259cf4ede0c2691bb9a/src/img/favicon.ico -------------------------------------------------------------------------------- /src/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | Gama Academy - Star Wars 9 | 10 | 11 | 12 |
13 | 14 | 15 | 16 | -------------------------------------------------------------------------------- /src/service/Utils.js: -------------------------------------------------------------------------------- 1 | const Utils = { 2 | parseRequestURL: () => { 3 | let url = location.hash.slice(1).toLowerCase() || '/'; 4 | let r = url.split('/'); 5 | let request = { 6 | resource: null, 7 | id: null, 8 | verb: null 9 | } 10 | 11 | request.resource = r[1]; 12 | request.id = r[2]; 13 | request.verb = r[3] 14 | 15 | return request; 16 | }, 17 | 18 | redirect_to: (next) => location.replace(`#/${next}`), 19 | 20 | sleep: (ms) => new Promise(resolve => setTimeout(resolve, ms)), 21 | 22 | } 23 | 24 | export default Utils; -------------------------------------------------------------------------------- /src/views/pages/errors/Error404.js: -------------------------------------------------------------------------------- 1 | let Error404 = { 2 | is_private: false, 3 | render: async () => { 4 | let view = `${error}` 5 | return view 6 | }, 7 | 8 | after_render: () => { 9 | console.log('Try another one... :)') 10 | } 11 | } 12 | let error = ` 13 |
14 | erro 404! 15 |
16 | ` 17 | 18 | export default Error404; -------------------------------------------------------------------------------- /src/views/pages/home/Home.js: -------------------------------------------------------------------------------- 1 | let Home = { 2 | is_private: false, 3 | 4 | render: async () => { 5 | let view = ` 6 |
7 |

Home

8 | 9 | `; 10 | 11 | return view 12 | }, 13 | 14 | after_render: async () => {} 15 | } 16 | 17 | export default Home; -------------------------------------------------------------------------------- /src/views/pages/index.js: -------------------------------------------------------------------------------- 1 | 2 | //errors 3 | import Error404 from './errors/Error404'; 4 | 5 | //Home 6 | import Home from './home/Home'; 7 | 8 | // exportar 9 | export const home = Home; 10 | export const error404 = Error404; -------------------------------------------------------------------------------- /webpack.common.js: -------------------------------------------------------------------------------- 1 | const webpack = require("webpack"); 2 | const path = require("path"); 3 | const { CleanWebpackPlugin } = require("clean-webpack-plugin"); 4 | 5 | const pathMainJs = require.resolve("./src/app.js"); 6 | const pathIndexCss = require.resolve("./src/css/style.css"); 7 | const pathIndexHtml = require.resolve("./src/index.html"); 8 | const pathIndexFavicon = require.resolve("./src/img/favicon.ico"); 9 | 10 | module.exports = { 11 | entry: [ 12 | '@babel/polyfill', 13 | pathMainJs, 14 | pathIndexHtml, 15 | pathIndexCss, 16 | pathIndexFavicon 17 | ], 18 | plugins: [ 19 | new CleanWebpackPlugin(), 20 | ], 21 | output: { 22 | path: path.resolve(__dirname, 'dist'), 23 | filename: 'app.js', 24 | publicPath: '/', 25 | }, 26 | module: { 27 | rules: [ 28 | { 29 | test: /\.js$/, 30 | use: 'babel-loader', 31 | exclude: /node_modules/ 32 | }, 33 | { 34 | test: /\.css$/i, 35 | type: 'asset/resource', 36 | generator: { 37 | filename: 'css/[name][ext][query]' 38 | } 39 | }, 40 | { 41 | test: /\.html$/i, 42 | type: 'asset/resource', 43 | generator: { 44 | filename: '[name][ext][query]' 45 | } 46 | }, 47 | { 48 | test: /\.(png|svg|jpg|jpeg|gif|ico)$/i, 49 | type: 'asset/resource', 50 | generator: { 51 | filename: 'img/[name][ext][query]' 52 | } 53 | }, 54 | ] 55 | } 56 | }; -------------------------------------------------------------------------------- /webpack.dev.js: -------------------------------------------------------------------------------- 1 | const { merge } = require('webpack-merge'); 2 | const common = require('./webpack.common'); 3 | 4 | module.exports = merge( common, { 5 | mode: 'development', 6 | devtool: 'inline-source-map', 7 | devServer: { 8 | contentBase: './dist', 9 | } 10 | }); -------------------------------------------------------------------------------- /webpack.prod.js: -------------------------------------------------------------------------------- 1 | const { merge } = require('webpack-merge'); 2 | const common = require('./webpack.common'); 3 | 4 | module.exports = merge( common, { 5 | mode: 'production' 6 | }); --------------------------------------------------------------------------------