├── .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 | });
--------------------------------------------------------------------------------