Auto commit for build : 71

commit by: hassani ayoub <hassani.ayoub@gmail.com>

 with message : upgrade some dependencies

README.md

@@ -0,0 +1,74 @@
+# @d3v4pp/cli : devapp 
+
+[![GitHub license](https://img.shields.io/badge/licence-d3v4pp-red.svg)](https://cvs.d3v4pp.fr/D3V4PP/cli.git) 
+[![npm version](https://img.shields.io/npm/v/@d3v4pp/cli?style=flat)](https://www.npmjs.com/package/@d3v4pp/cli)
+
+
+
+ 
+is a command line cli that will run build and init SweetApps 
+with `devapp` command line you can create, build, start(dev mode) or test your app
+
+### Basic usage:
+To install the command line cli run : 
+~~~
+npm install -g @d3v4pp/cli
+~~~
+
+Start your application from default template
+
+~~~
+devapp init Myapp
+cd Myapp
+devapp start
+~~~
+
+Build your app
+~~~
+devapp build
+~~~
+
+
+## start params
+You can change the port and public path you want, by calling `devapp start -p 9090 -public "/v1"
+
+|param| description |
+|:-----:|:-----:|
+|-p, --port | the port you want to start on |
+|-public, --public| the port you want to start on |
+
+
+## build params
+You can change the public path you want, by calling `devapp build --public "/v1"
+
+|param| description |
+|:-----:|:-----:|
+|-public, --public| the port you want to start on |
+
+
+
+
+## Commun problems
+### WINDOWS
+The execution strategie dosent allow remoteSigned execution need to allow it
+```
+set ExecutionStrqtegie ....
+```
+
+### MACOSX:
+if your using a mac make sure xcode is installed run
+~~~sh
+$ gcc -v 
+#if it propose to you to install xcode do it
+~~~
+
+### linux
+
+```
+No problem at all
+```
+
+
+# release notes
+## version 0.0.2:
+* corrige le bug dans la commande `devapp build` 

package.json

@@ -0,0 +1,78 @@
+{
+    "name": "@d3v4pp/cli",
+    "version": "0.0.2",
+    "description": "Client that allows to develop react applications faster",
+    "main": "index.js",
+    "publishConfig": {
+        "access": "public"
+    },
+    "bin": {
+        "devapp": "index.js"
+    },
+    "repository": {
+        "type": "git",
+        "url": "https://cvs.d3v4pp.fr/D3V4PP/cli.git"
+    },
+    "files": [
+        "template",
+        "index.js",
+        "package.json",
+        "README.md"
+    ],
+    "keywords": [
+        "fast",
+        "easy",
+        "best practice",
+        "react app",
+        "runner",
+        "react",
+        "react-dom",
+        "app"
+    ],
+    "author": {
+        "name": "Ayoub Hassani <D3v4pp>",
+        "email": "ayoub@d3v4pp.fr",
+        "url": "https://d3v4pp.fr/"
+    },
+    "funding": "https://paypal.me/SupportTheDoc",
+    "homepage": "https://cvs.d3v4pp.fr/D3V4PP/cli/src/master/README.md",
+    "bugs": {
+        "url": "https://cvs.d3v4pp.fr/D3V4PP/cli/issues",
+        "email": "ayoub@d3v4pp.fr"
+    },
+    "license": "d3v4pp",
+    "peerDependenciesMeta": {
+        "sass": {
+            "optional": true
+        },
+        "fibers": {
+            "optional": true
+        }
+    },
+    "dependencies": {
+        "@babel/core": "^7.6.0",
+        "@babel/plugin-proposal-class-properties": "^7.5.5",
+        "@babel/preset-env": "^7.18.6",
+        "@babel/preset-react": "^7.18.6",
+        "@sweetcom/colors": "^0.0.21",
+        "babel-eslint": "^10.1.0",
+        "babel-loader": "^8.0.6",
+        "copy-webpack-plugin": "^11.0.0",
+        "css-loader": "^6.8.1",
+        "eslint-loader": "^4.0.2",
+        "eslint-webpack-plugin": "^3.1.1",
+        "file-loader": "^6.2.0",
+        "html-webpack-plugin": "^5.5.0",
+        "jsdoc": "^4.0.2",
+        "mini-css-extract-plugin": "^2.6.1",
+        "prop-types": "^15.8.1",
+        "react": "^18.2.0",
+        "react-dom": "^18.2.0",
+        "sass": "^1.69.4",
+        "sass-loader": "^13.3.2",
+        "style-loader": "^3.3.3",
+        "webpack": "^5.89.0",
+        "webpack-dev-server": "^4.15.1",
+        "webpack-node-externals": "^3.0.0"
+    }
+}

template/react/.eslintrc

@@ -0,0 +1,41 @@
+{
+    "extends": "plugin:react/recommended",
+    // "parser": "babel-eslint",
+    "rules": {
+        "react/jsx-uses-react": 1,
+        "react/jsx-uses-vars": 1,
+        "react/react-in-jsx-scope": 1,
+        "react/jsx-tag-spacing": [0, {
+          "beforeSelfClosing": "always"
+        }],
+        "curly": [1],
+        "linebreak-style": [1, "unix"],
+        "semi": [1, "always"],
+        "comma-dangle": [0],
+        "no-unused-vars": [1, {
+          "vars": "all",
+          "args": "none",
+          "ignoreRestSiblings": true
+        }],
+        "no-console": [0],
+        "object-curly-spacing": [1, "always"],
+        "keyword-spacing": ["error"]
+    },
+    "parserOptions": {
+      "ecmaFeatures": {
+          "experimentalObjectRestSpread": true,
+          "jsx": true
+      },
+      "sourceType": "module"
+  },
+    "env": {
+        "es6": true,
+        "browser": true,
+        "node": false
+    },
+    "plugins": [
+        "jsx-a11y",
+        "react"
+    ]
+}
+

template/react/.gitignore

@@ -0,0 +1,11 @@
+# dependencies
+/node_modules
+
+
+# production
+/build
+
+#IDE
+.vscode/
+.project/
+.idea/

template/react/README.md

@@ -0,0 +1 @@
+# @d3v4pp/cli : React template 

template/react/package.json

@@ -0,0 +1,15 @@
+{
+  "name": "{name}",
+  "version": "0.0.1",
+  "description": "sweet react base App",
+  "license": "MIT",
+  "scripts": {
+    "start": "devapp start -t react",
+    "build": "devapp build -t react"
+  },
+  "main": "./src/index.js",
+  "dependencies": {
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0"
+  }
+}

template/react/src/App.js

@@ -0,0 +1,24 @@
+import React, { Component } from 'react';
+import './App.scss';
+class App extends Component {
+  render() {
+    return (
+      <div className="App">
+        <header className="App-header">
+          <img src='/assets/logo.png' className="App-logo" alt="logo" />
+          <h1 className="App-title">Welcome to Sweet React Application</h1>
+        </header>
+        <p className="App-intro">
+          HOT MODULE REPLACEMENT is on so :
+          <br/>
+          do not reload the browser
+           <br />
+          Just edit <code>src/App.js</code>
+          <br />
+          and save to reload.        </p>
+      </div>
+    );
+  }
+}
+
+export default App;

template/react/src/App.scss

@@ -0,0 +1,23 @@
+.App {
+  text-align: center;
+}
+
+.App-logo {
+  height: 80px;
+}
+
+.App-header {
+  background-color: #222;
+  height: 150px;
+  padding: 20px;
+  color: white;
+}
+
+.App-title {
+  font-size: 1.5em;
+}
+
+.App-intro {
+  font-size: large;
+}
+

template/react/src/App.test.js

@@ -0,0 +1,8 @@
+import React from 'react';
+import ReactDOM from 'react-dom';
+import App from './App';
+
+it('renders without crashing', () => {
+  const div = document.createElement('div');
+  ReactDOM.render(<App />, div);
+});

template/react/src/assets/manifest.json

@@ -0,0 +1,20 @@
+{
+  "short_name": "name",
+  "name": "name",
+  "icons": [
+      {
+          "src": "/assets/logo.png",
+          "sizes": "256x256",
+          "type": "image/png"
+      },
+      {
+          "src": "/assets/logo.png",
+          "sizes": "64x64 32x32 24x24 16x16",
+          "type": "image/x-icon"
+      }
+  ],
+  "start_url": "/",
+  "display": "standalone",
+  "theme_color": "#000000",
+  "background_color": "#ffffff"
+}

template/react/src/index.html

@@ -0,0 +1,22 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
+    <meta name="theme-color" content="#000000">
+    <!--
+      manifest.json provides metadata used when your web app is added to the
+      homescreen on Android. See https://developers.google.com/web/fundamentals/engage-and-retain/web-app-manifest/
+    -->
+    <link rel="shortcut icon" href="<%= favicon %>" type="image/x-icon">
+    <link rel="manifest" href="<%= manifest %>">
+
+    <title>Update Me To Title Your App</title>
+  </head>
+  <body>
+    <noscript>
+      You need to enable JavaScript to run this app.
+    </noscript>
+    <div id="root"></div>
+  </body>
+</html>

template/react/src/index.js

@@ -0,0 +1,10 @@
+import React from 'react';
+import './index.scss';
+import reactDom from 'react-dom';
+
+import App from './App';
+// let root = createRoot(document.getElementById('root'))
+reactDom.render(<App/>,document.getElementById('root'));
+if (module && module.hot) {
+    module.hot.accept();
+}

template/react/src/index.scss

@@ -0,0 +1,5 @@
+body {
+  margin: 0;
+  padding: 0;
+  font-family: sans-serif;
+}

template/react_autonome/.eslintrc

@@ -0,0 +1,41 @@
+{
+    "extends": "plugin:react/recommended",
+    // "parser": "babel-eslint",
+    "rules": {
+        "react/jsx-uses-react": 1,
+        "react/jsx-uses-vars": 1,
+        "react/react-in-jsx-scope": 1,
+        "react/jsx-tag-spacing": [0, {
+          "beforeSelfClosing": "always"
+        }],
+        "curly": [1],
+        "linebreak-style": [1, "unix"],
+        "semi": [1, "always"],
+        "comma-dangle": [0],
+        "no-unused-vars": [1, {
+          "vars": "all",
+          "args": "none",
+          "ignoreRestSiblings": true
+        }],
+        "no-console": [0],
+        "object-curly-spacing": [1, "always"],
+        "keyword-spacing": ["error"]
+    },
+    "parserOptions": {
+      "ecmaFeatures": {
+          "experimentalObjectRestSpread": true,
+          "jsx": true
+      },
+      "sourceType": "module"
+  },
+    "env": {
+        "es6": true,
+        "browser": true,
+        "node": false
+    },
+    "plugins": [
+        "jsx-a11y",
+        "react"
+    ]
+}
+

template/react_autonome/.gitignore

@@ -0,0 +1,11 @@
+# dependencies
+/node_modules
+
+
+# production
+/build
+
+#IDE
+.vscode/
+.project/
+.idea/

template/react_autonome/README.md

@@ -0,0 +1 @@
+# @d3v4pp/cli : React template 

template/react_autonome/ReactBuilder.js

@@ -0,0 +1,27 @@
+const webpack = require('webpack');
+const configWP = require("./webpack.config");
+
+
+const compiler = webpack(configWP);
+
+compiler.run((err, stats) => {
+    if (err ) {
+        throw err;
+    }
+    if (stats.hasErrors()) {
+        console.error(stats.toString({
+            chunks: false,  // Makes the build much quieter
+            colors: true    // Shows colors in the console
+          }));
+    }
+    compiler.close((closeErr) => {
+        if (closeErr) {
+            throw closeErr;
+        }
+        // process.stdout.write(stats.toString() + '\n');
+        console.log(stats.toString({
+            chunks: false,  // Makes the build much quieter
+            colors: true    // Shows colors in the console
+          }));
+    });
+});

template/react_autonome/ReactStarter.js

@@ -0,0 +1,16 @@
+const Webpack = require('webpack');
+const WebpackDevServer = require('webpack-dev-server');
+const webpackConfig = require('./webpack.config.js');
+
+webpackConfig.mode = "development";
+
+
+const compiler = Webpack(webpackConfig);
+const devServerOptions = { ...webpackConfig.devServer, open: true };
+const server = new WebpackDevServer(devServerOptions, compiler);
+const runServer = async () => {
+  console.log('Starting server...');
+  await server.start();
+};
+
+runServer();

template/react_autonome/package.json

@@ -0,0 +1,15 @@
+{
+  "name": "{name}",
+  "version": "0.0.1",
+  "description": "sweet react base App",
+  "license": "MIT",
+  "scripts": {
+    "start": "devapp start -t react",
+    "build": "devapp build -t react"
+  },
+  "main": "./src/index.js",
+  "dependencies": {
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0"
+  }
+}

template/react_autonome/src/App.js

@@ -0,0 +1,24 @@
+import React, { Component } from 'react';
+import './App.scss';
+class App extends Component {
+  render() {
+    return (
+      <div className="App">
+        <header className="App-header">
+          <img src='/assets/logo.png' className="App-logo" alt="logo" />
+          <h1 className="App-title">Welcome to Sweet React Application</h1>
+        </header>
+        <p className="App-intro">
+          HOT MODULE REPLACEMENT is on so :
+          <br/>
+          do not reload the browser
+           <br />
+          Just edit <code>src/App.js</code>
+          <br />
+          and save to reload.        </p>
+      </div>
+    );
+  }
+}
+
+export default App;

template/react_autonome/src/App.scss

@@ -0,0 +1,23 @@
+.App {
+  text-align: center;
+}
+
+.App-logo {
+  height: 80px;
+}
+
+.App-header {
+  background-color: #222;
+  height: 150px;
+  padding: 20px;
+  color: white;
+}
+
+.App-title {
+  font-size: 1.5em;
+}
+
+.App-intro {
+  font-size: large;
+}
+

template/react_autonome/src/App.test.js

@@ -0,0 +1,8 @@
+import React from 'react';
+import ReactDOM from 'react-dom';
+import App from './App';
+
+it('renders without crashing', () => {
+  const div = document.createElement('div');
+  ReactDOM.render(<App />, div);
+});

template/react_autonome/src/assets/manifest.json

@@ -0,0 +1,20 @@
+{
+  "short_name": "name",
+  "name": "name",
+  "icons": [
+      {
+          "src": "/assets/logo.png",
+          "sizes": "256x256",
+          "type": "image/png"
+      },
+      {
+          "src": "/assets/logo.png",
+          "sizes": "64x64 32x32 24x24 16x16",
+          "type": "image/x-icon"
+      }
+  ],
+  "start_url": "/",
+  "display": "standalone",
+  "theme_color": "#000000",
+  "background_color": "#ffffff"
+}

template/react_autonome/src/index.html

@@ -0,0 +1,22 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
+    <meta name="theme-color" content="#000000">
+    <!--
+      manifest.json provides metadata used when your web app is added to the
+      homescreen on Android. See https://developers.google.com/web/fundamentals/engage-and-retain/web-app-manifest/
+    -->
+    <link rel="shortcut icon" href="<%= favicon %>" type="image/x-icon">
+    <link rel="manifest" href="<%= manifest %>">
+
+    <title>Update Me To Title Your App</title>
+  </head>
+  <body>
+    <noscript>
+      You need to enable JavaScript to run this app.
+    </noscript>
+    <div id="root"></div>
+  </body>
+</html>

template/react_autonome/src/index.js

@@ -0,0 +1,9 @@
+import React from 'react';
+import reactDom from 'react-dom';
+import './index.scss';
+import App from './App';
+// let root = createRoot(document.getElementById('root'))
+reactDom.render(<App/>,document.getElementById('root'));
+if (module && module.hot) {
+    module.hot.accept();
+}

template/react_autonome/src/index.scss

@@ -0,0 +1,5 @@
+body {
+  margin: 0;
+  padding: 0;
+  font-family: sans-serif;
+}

template/react_autonome/webpack.config.js

@@ -0,0 +1,64 @@
+const path = require('path');
+const HtmlWebpackPlugin = require('html-webpack-plugin');
+const MiniCssExtractPlugin = require("mini-css-extract-plugin");
+const CopyPlugin = require("copy-webpack-plugin");
+
+module.exports = {
+  entry: ['./src/index.js'],
+  mode: "production",
+  target: "web",
+  module: {
+    rules: [
+      {
+        test: /\.(js|jsx)$/i,
+        exclude: /(node_modules|bower_components)/,
+        use: {
+          loader: 'babel-loader',
+          options: {
+            presets: ['@babel/preset-env', "@babel/preset-react"],
+          }
+        }
+      },
+      {
+        test: /\.s[ac]ss$/i,
+        use: [MiniCssExtractPlugin.loader, "css-loader", "sass-loader"],
+      },
+      {
+        test: /\.css$/i,
+        use: [MiniCssExtractPlugin.loader, "css-loader"],
+      }
+    ],
+  },
+  plugins: [new HtmlWebpackPlugin({
+    template: path.resolve("src", "index.html")
+  }), new MiniCssExtractPlugin(),
+  new CopyPlugin({
+    patterns: [
+      { from: "src/assets", to: "assets" }
+    ],
+  })],
+  output: {
+    path: path.resolve(__dirname, 'build'),
+    filename: '[name].d3v4pp.bundle.js',
+    publicPath: "/"
+  },
+  devServer: {
+    client: {
+      progress: true,
+      reconnect: true,
+      overlay: {
+        errors: true,
+        warnings: false,
+      },
+    },
+    hot: true,
+    historyApiFallback: true,
+    open: true,
+    static: {
+      directory: path.join(__dirname, 'src'),
+    },
+    compress: true,
+    port: 9000,
+   
+  }
+};

template/simple/README.md

@@ -0,0 +1 @@
+# @d3v4pp/cli : Simple template 

template/simple/package.json

@@ -0,0 +1,17 @@
+{
+  "name": "{name}",
+  "version": "1.0.0",
+  "description": "@d3v4pp browser template to use with jquery materialize bootstrap and all native browser javascript framworks",
+  "main": "src/index.js",
+  "scripts": {
+    "start": "devapp start -t simple",
+    "build": "devapp build -t simple"
+  },
+  "keywords": [],
+  "author": "",
+  "license": "ISC",
+  "dependencies": {
+    "jquery": "^3.6.0",
+    "materialize-css": "^1.0.0-rc.2"
+  }
+}

template/simple/src/assets/manifest.json

@@ -0,0 +1,20 @@
+{
+    "short_name": "test",
+    "name": "test",
+    "icons": [
+        {
+            "src": "./logo.png",
+            "sizes": "256x256",
+            "type": "image/png"
+        },
+        {
+            "src": "logo.png",
+            "sizes": "64x64 32x32 24x24 16x16",
+            "type": "image/x-icon"
+        }
+    ],
+    "start_url": "/",
+    "display": "standalone",
+    "theme_color": "#000000",
+    "background_color": "#ffffff"
+}

template/simple/src/index.html

@@ -0,0 +1,14 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <link rel="shortcut icon" href="<%= favicon %>" type="image/x-icon">
+    <link rel="manifest" href="<%= manifest %>">
+
+    <title>Document</title>
+</head>
+<body>
+</body>
+</html>

template/simple/src/index.js

@@ -0,0 +1,41 @@
+import "./style.scss";
+import "materialize-css/dist/css/materialize.css";
+import $ from 'jQuery';
+$(() => {
+  console.log("its working")
+  $(`body`).append($(`
+    <ul class="collection">
+      <li class="collection-item avatar">
+        <img src="/assets/logo.png" alt="" class="circle">
+        <span class="title">AYOUB</span>
+        <p>First Line <br>
+           Second Line
+        </p>
+        <a href="#!" class="secondary-content"><i class="material-icons">grade</i></a>
+      </li>
+      <li class="collection-item avatar">
+      <img src="/assets/logo.png" alt="" class="circle">
+        <span class="title">SOSO</span>
+        <p>First Line <br>
+           Second Line
+        </p>
+        <a href="#!" class="secondary-content"><i class="material-icons">grade</i></a>
+      </li>
+      <li class="collection-item avatar">
+      <img src="/assets/logo.png" alt="" class="circle">
+        <span class="title">TONTON</span>
+        <p>First Line <br>
+           Second Line
+        </p>
+        <a href="#!" class="secondary-content"><i class="material-icons">grade</i></a>
+      </li>
+      <li class="collection-item avatar">
+      <img src="/assets/logo.png" alt="" class="circle">
+        <span class="title">Title</span>
+        <p>First Line <br>
+           Second Line
+        </p>
+        <a href="#!" class="secondary-content"><i class="material-icons">grade</i></a>
+      </li>
+    </ul>`));
+});

template/simple/src/style.scss

@@ -0,0 +1,7 @@
+$body-color: red;
+$body-bg-color: rgba(41, 231, 248, 0.382);
+
+body {
+  color: $body-color;
+  background-color: $body-bg-color;
+}

template/simple_autonome/README.md

@@ -0,0 +1 @@
+# @d3v4pp/cli : Simple template 

template/simple_autonome/SimpleBuilder.js

@@ -0,0 +1,27 @@
+const webpack = require('webpack');
+const configWP = require("./webpack.config");
+
+
+const compiler = webpack(configWP);
+
+compiler.run((err, stats) => {
+    if (err ) {
+        throw err;
+    }
+    if (stats.hasErrors()) {
+        console.error(stats.toString({
+            chunks: false,  // Makes the build much quieter
+            colors: true    // Shows colors in the console
+          }));
+    }
+    compiler.close((closeErr) => {
+        if (closeErr) {
+            throw closeErr;
+        }
+        // process.stdout.write(stats.toString() + '\n');
+        console.log(stats.toString({
+            chunks: false,  // Makes the build much quieter
+            colors: true    // Shows colors in the console
+          }));
+    });
+});

template/simple_autonome/SimpleStarter.js

@@ -0,0 +1,16 @@
+const Webpack = require('webpack');
+const WebpackDevServer = require('webpack-dev-server');
+const webpackConfig = require('./webpack.config.js');
+
+webpackConfig.mode = "development";
+
+
+const compiler = Webpack(webpackConfig);
+const devServerOptions = { ...webpackConfig.devServer, open: true };
+const server = new WebpackDevServer(devServerOptions, compiler);
+const runServer = async () => {
+  console.log('Starting server...');
+  await server.start();
+};
+
+runServer();

template/simple_autonome/package.json

@@ -0,0 +1,24 @@
+{
+  "name": "simple",
+  "version": "1.0.0",
+  "description": "",
+  "main": "webpack.config.js",
+  "scripts": {
+    "test": "echo \"Error: no test specified\" && exit 1"
+  },
+  "keywords": [],
+  "author": "",
+  "license": "ISC",
+  "devDependencies": {
+    "html-webpack-plugin": "^5.5.0",
+    "mini-css-extract-plugin": "^2.6.1",
+    "sass": "^1.53.0",
+    "sass-loader": "^13.0.2",
+    "webpack": "^5.73.0",
+    "webpack-dev-server": "^4.9.3"
+  },
+  "dependencies": {
+    "jquery": "^3.6.0",
+    "materialize-css": "^1.0.0-rc.2"
+  }
+}

template/simple_autonome/src/assets/manifest.json

@@ -0,0 +1,20 @@
+{
+    "short_name": "test",
+    "name": "test",
+    "icons": [
+        {
+            "src": "./logo.png",
+            "sizes": "256x256",
+            "type": "image/png"
+        },
+        {
+            "src": "logo.png",
+            "sizes": "64x64 32x32 24x24 16x16",
+            "type": "image/x-icon"
+        }
+    ],
+    "start_url": "/",
+    "display": "standalone",
+    "theme_color": "#000000",
+    "background_color": "#ffffff"
+}

template/simple_autonome/src/index.html

@@ -0,0 +1,14 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <link rel="shortcut icon" href="<%= favicon %>" type="image/x-icon">
+<link rel="manifest" href="<%= manifest %>">
+    <title>Document</title>
+</head>
+<body>
+    
+</body>
+</html>

template/simple_autonome/src/index.js

@@ -0,0 +1,42 @@
+import "./style.scss";
+import "materialize-css/dist/css/materialize.css";
+import $ from 'jQuery';
+$(() => {
+  console.log("its working")
+  $(`body`).append($(`
+    <ul class="collection">
+      <li class="collection-item avatar">
+        <img src="/assets/logo.png" alt="" class="circle">
+        <span class="title">AYOUB</span>
+        <p>First Line <br>
+           Second Line
+        </p>
+        <a href="#!" class="secondary-content"><i class="material-icons">grade</i></a>
+      </li>
+      <li class="collection-item avatar">
+      <img src="/assets/logo.png" alt="" class="circle">
+        <span class="title">SOSO</span>
+        <p>First Line <br>
+           Second Line
+        </p>
+        <a href="#!" class="secondary-content"><i class="material-icons">grade</i></a>
+      </li>
+      <li class="collection-item avatar">
+      <img src="/assets/logo.png" alt="" class="circle">
+        <span class="title">TONTON</span>
+        <p>First Line <br>
+           Second Line
+        </p>
+        <a href="#!" class="secondary-content"><i class="material-icons">grade</i></a>
+      </li>
+      <li class="collection-item avatar">
+      <img src="/assets/logo.png" alt="" class="circle">
+        <span class="title">Title</span>
+        <p>First Line <br>
+           Second Line
+        </p>
+        <a href="#!" class="secondary-content"><i class="material-icons">grade</i></a>
+      </li>
+    </ul>`));
+});
+//

template/simple_autonome/src/style.scss

@@ -0,0 +1,7 @@
+$body-color: red;
+$body-bg-color: rgba(41, 231, 248, 0.382);
+
+body {
+  color: $body-color;
+  background-color: $body-bg-color;
+}

template/simple_autonome/webpack.config.js

@@ -0,0 +1,56 @@
+const path = require('path');
+const HtmlWebpackPlugin = require('html-webpack-plugin');
+const MiniCssExtractPlugin = require("mini-css-extract-plugin");
+const CopyPlugin = require('copy-webpack-plugin');
+
+module.exports = {
+  entry: ['./src/index.js'],
+  mode: "production",
+  target: "web",
+  module: {
+    rules: [
+      {
+        test: /\.s[ac]ss$/i,
+        use: [MiniCssExtractPlugin.loader, "css-loader", "sass-loader"],
+      },
+      {
+        test: /\.css$/i,
+        use: [MiniCssExtractPlugin.loader, "css-loader"],
+      }
+    ],
+  },
+  plugins: [new HtmlWebpackPlugin({
+    template: path.resolve("src", "index.html"),
+    templateParameters: {
+      'favicon': '/assets/logo.png',
+      'manifest': '/assets/manifest.json'
+  },
+  }), new MiniCssExtractPlugin(),new CopyPlugin({
+    patterns: [
+        { from: "src/assets", to: "assets" }
+    ],
+})],
+  output: {
+    path: path.resolve(__dirname, 'build'),
+    filename: '[name].d3v4pp.bundle.js',
+    publicPath: "/"
+
+  },
+  devServer: {
+    client: {
+      progress: true,
+      reconnect: true,
+      overlay: {
+        errors: true,
+        warnings: false,
+      },
+    },
+    historyApiFallback: true,
+    open: true,
+    static: {
+      directory: path.join(__dirname, 'src'),
+    },
+    compress: true,
+    port: 9000
+  }
+};

template/sweet/.eslintrc

@@ -0,0 +1,34 @@
+{
+    "extends": "eslint:recommended",
+    "parser": "babel-eslint",
+    "rules": {
+        "react/jsx-uses-react": 1,
+        "react/jsx-uses-vars": 1,
+        "react/react-in-jsx-scope": 1,
+        "react/jsx-tag-spacing": [0, {
+          "beforeSelfClosing": "always"
+        }],
+        "curly": [1],
+        "linebreak-style": [1, "unix"],
+        "semi": [1, "always"],
+        "comma-dangle": [0],
+        "no-unused-vars": [1, {
+          "vars": "all",
+          "args": "none",
+          "ignoreRestSiblings": true
+        }],
+        "no-console": [0],
+        "object-curly-spacing": [1, "always"],
+        "keyword-spacing": ["error"]
+    },
+    "env": {
+        "es6": true,
+        "browser": true,
+        "node": true
+    },
+    "plugins": [
+        "jsx-a11y",
+        "react"
+    ]
+}
+

template/sweet/.gitignore

@@ -0,0 +1,11 @@
+# dependencies
+/node_modules
+
+
+# production
+/build
+
+#IDE
+.vscode/
+.project/
+.idea/

template/sweet/README.md

@@ -0,0 +1,18 @@
+# Sweet app sweet
+
+This is a base application generated by @sweetcom/cli
+// TODO feel free to update all files in this template
+ 
+## start developpement
+
+run : 
+~~~
+npm start 
+//or
+sweet start 
+// to start dev server
+~~~
+
+
+## more documentation 
+please visite [@Sweetcom/cli](http://cli.sweetcom75.fr) web site

template/sweet/package.json

@@ -0,0 +1,21 @@
+{
+  "name": "FOLDERNAME",
+  "version": "0.0.1",
+  "description": "sweet react base App",
+  "license": "MIT",
+  "scripts": {
+    "start": "devapp start",
+    "build": "devapp build"
+  },
+  "main": "./src/index.js",
+  "devDependencies": {
+    "babel-eslint": "^10.1.0",
+    "eslint-loader": "^4.0.2",
+    "eslint-plugin-jsx-a11y": "^6.5.1",
+    "eslint-plugin-react": "^7.29.3"
+  },
+  "dependencies": {
+    "react": "^16.12.0",
+    "react-dom": "^16.12.0"
+  }
+}

template/sweet/public/manifest.json

@@ -0,0 +1,20 @@
+{
+  "short_name": "Sweet App",
+  "name": "SweetCom75 way to write Apps",
+  "icons": [
+    {
+      "src": "assets/logo.png",
+      "sizes": "256x256",
+      "type": "image/png"
+    },
+    {
+      "src": "favicon.ico",
+      "sizes": "64x64 32x32 24x24 16x16",
+      "type": "image/x-icon"
+    }
+  ],
+  "start_url": "./index.html",
+  "display": "standalone",
+  "theme_color": "#000000",
+  "background_color": "#ffffff"
+}

template/sweet/src/App.js

@@ -0,0 +1,24 @@
+import React, { Component } from 'react';
+import './App.scss';
+class App extends Component {
+  render() {
+    return (
+      <div className="App">
+        <header className="App-header">
+          <img src='/assets/logo.png' className="App-logo" alt="logo" />
+          <h1 className="App-title">Welcome to Sweet React Application</h1>
+        </header>
+        <p className="App-intro">
+          HOT MODULE REPLACEMENT is on so :
+          <br/>
+          do not reload the browser
+           <br />
+          Just edit <code>src/App.js</code>
+          <br />
+          and save to reload.        </p>
+      </div>
+    );
+  }
+}
+
+export default App;

template/sweet/src/App.scss

@@ -0,0 +1,23 @@
+.App {
+  text-align: center;
+}
+
+.App-logo {
+  height: 80px;
+}
+
+.App-header {
+  background-color: #222;
+  height: 150px;
+  padding: 20px;
+  color: white;
+}
+
+.App-title {
+  font-size: 1.5em;
+}
+
+.App-intro {
+  font-size: large;
+}
+

template/sweet/src/App.test.js

@@ -0,0 +1,8 @@
+import React from 'react';
+import ReactDOM from 'react-dom';
+import App from './App';
+
+it('renders without crashing', () => {
+  const div = document.createElement('div');
+  ReactDOM.render(<App />, div);
+});

template/sweet/src/index.html

@@ -0,0 +1,21 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
+    <meta name="theme-color" content="#000000">
+    <!--
+      manifest.json provides metadata used when your web app is added to the
+      homescreen on Android. See https://developers.google.com/web/fundamentals/engage-and-retain/web-app-manifest/
+    -->
+  <link rel="manifest" href="/manifest.json">
+    <link rel="shortcut icon" href="/favicon.ico">
+    <title>Update Me To Title Your App</title>
+  </head>
+  <body>
+    <noscript>
+      You need to enable JavaScript to run this app.
+    </noscript>
+    <div id="root"></div>
+  </body>
+</html>

template/sweet/src/index.js

@@ -0,0 +1,10 @@
+import React from 'react';
+import ReactDOM from 'react-dom';
+import './index.scss';
+import App from './App';
+
+ReactDOM.render(<App />, document.getElementById('root'));
+
+if (module && module.hot) {
+    module.hot.accept();
+}

template/sweet/src/index.scss

@@ -0,0 +1,5 @@
+body {
+  margin: 0;
+  padding: 0;
+  font-family: sans-serif;
+}