├── .github
    └── workflows
    │   └── test.yaml
├── .gitignore
├── .parcelrc
├── README.md
├── jest.config.js
├── package.json
├── src
    ├── __tests__
    │   └── main.test.ts
    ├── decls.d.ts
    ├── index.html
    └── main.tsx
├── tsconfig.json
└── yarn.lock


/.github/workflows/test.yaml:
--------------------------------------------------------------------------------
 1 | name: Test
 2 | 
 3 | on: [push]
 4 | 
 5 | jobs:
 6 |   test:
 7 |     runs-on: ubuntu-latest
 8 |     steps:
 9 |       - uses: actions/checkout@v1
10 |       - uses: actions/setup-node@v1
11 |         with:
12 |           node-version: 12
13 |       - run: yarn install
14 |       - run: yarn typecheck
15 |       - run: yarn build
16 |       - run: yarn test


--------------------------------------------------------------------------------
/.gitignore:
--------------------------------------------------------------------------------
 1 | ### https://raw.github.com/github/gitignore/967cd6479319efde70a6fa44fa1bfa02020f2357/Node.gitignore
 2 | 
 3 | # Logs
 4 | logs
 5 | *.log
 6 | npm-debug.log*
 7 | yarn-debug.log*
 8 | yarn-error.log*
 9 | 
10 | # Coverage directory used by tools like istanbul
11 | coverage
12 | 
13 | # Dependency directories
14 | node_modules/
15 | 
16 | # Optional npm cache directory
17 | .npm
18 | 
19 | # Optional eslint cache
20 | .eslintcache
21 | 
22 | # Yarn Integrity file
23 | .yarn-integrity
24 | 
25 | # dotenv environment variables file
26 | .env
27 | 
28 | # parcel-bundler cache (https://parceljs.org/)
29 | .cache
30 | 
31 | # next.js build output
32 | .next
33 | 
34 | # nuxt.js build output
35 | .nuxt
36 | 
37 | # vuepress build output
38 | .vuepress/dist
39 | 
40 | # Serverless directories
41 | .serverless
42 | 
43 | dist
44 | .netlify
45 | .parcel-cache


--------------------------------------------------------------------------------
/.parcelrc:
--------------------------------------------------------------------------------
1 | {
2 |   "extends": ["@parcel/config-default"]
3 | }


--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
 1 | # Minfront
 2 | 
 3 | My minimum frontend boilerplate 201811
 4 | 
 5 | - yarn
 6 | - parcel
 7 | - typescript
 8 | - jest
 9 | - netlify
10 | 
11 | This code does **not** include framework, lint, ci, and other (production) tools.
12 | 
13 | ## Bootstrap
14 | 
15 | ```bash
16 | # ... Setup node and yarn
17 | $ git clone git@github.com:mizchi-sandbox/minfront.git --depth 1 myspa
18 | $ cd myspa
19 | $ git remote rm origin # optional
20 | $ yarn install
21 | $ yarn dev    # Start app server
22 | $ yarn build  # Build to dist
23 | $ yarn test   # Run jest
24 | $ yarn deploy # Deploy to netlify
25 | ```
26 | 
27 | ## Optional: Rocommended tools
28 | 
29 | - https://github.com/prettier/prettier
30 | - https://github.com/paulirish/pwmetrics
31 | - https://github.com/xavdid/typed-install
32 | - https://github.com/saadq/lynt (at first linting)
33 | 
34 | ## Advanced: Build your own project like minfront
35 | 
36 | This project is based on my handy shell command.
37 | 
38 | ```
39 | $ mkdir app_name; cd app_name
40 | $ yarn init -y; git init; gibo dump Node > .gitignore; yarn add typescript -D; yarn tsc --init
41 | ```
42 | 
43 | Optional: Replace `{app_name}` to `your-app-name` and remove README so far.
44 | 
45 | ---
46 | 
47 | # {app_name}
48 | 
49 | ## How to dev
50 | 
51 | - `yarn dev`: Start application server on `http://localhost:1234`
52 | - `yarn build`: Generate `dist`
53 | - `yarn test`: Run jest
54 | - `yarn deploy`: Deploy to netlify (need netlify account)
55 | 
56 | ## LICENSE
57 | 
58 | MIT
59 | 


--------------------------------------------------------------------------------
/jest.config.js:
--------------------------------------------------------------------------------
1 | module.exports = {
2 |   roots: ["<rootDir>/src"],
3 |   transform: {
4 |     "^.+\\.tsx?$": "ts-jest"
5 |   },
6 |   testRegex: "(/__tests__/.*|(\\.|/)(test|spec))\\.tsx?$",
7 |   moduleFileExtensions: ["ts", "tsx", "js", "jsx", "json", "node"]
8 | };
9 | 


--------------------------------------------------------------------------------
/package.json:
--------------------------------------------------------------------------------
 1 | {
 2 |   "private": true,
 3 |   "license": "MIT",
 4 |   "scripts": {
 5 |     "dev": "parcel src/index.html --open",
 6 |     "build": "parcel build src/index.html",
 7 |     "typecheck": "tsc -p . --noEmit",
 8 |     "test": "jest",
 9 |     "deploy": "netlify deploy -d dist --prod"
10 |   },
11 |   "dependencies": {
12 |     "core-js": "3"
13 |   },
14 |   "devDependencies": {
15 |     "@types/jest": "^24.0.11",
16 |     "jest": "^24.9.0",
17 |     "netlify-cli": "^2.17.0",
18 |     "parcel": "^2.0.0-alpha.1.1",
19 |     "ts-jest": "^24.1.0",
20 |     "typescript": "^3.7.0-beta"
21 |   }
22 | }
23 | 


--------------------------------------------------------------------------------
/src/__tests__/main.test.ts:
--------------------------------------------------------------------------------
 1 | import assert from "assert";
 2 | 
 3 | test("sample", () => {
 4 |   assert(1 === 1);
 5 | });
 6 | 
 7 | // === Test example
 8 | //
 9 | // beforeEach(() => {
10 | //   document.body.innerHTML = `<div class="root"></div>`;
11 | // });
12 | 
13 | // test("Run app", () => {
14 | //   require("../main");
15 | //   assert(document.body.textContent === "Hello, {app_name}");
16 | // });
17 | 


--------------------------------------------------------------------------------
/src/decls.d.ts:
--------------------------------------------------------------------------------
1 | /* === Ignore === */
2 | 
3 | // declare module "lib-name";
4 | 


--------------------------------------------------------------------------------
/src/index.html:
--------------------------------------------------------------------------------
 1 | <!DOCTYPE html>
 2 | <html lang="en-US">
 3 |   <head>
 4 |     <title>{app_name}</title>
 5 |     <meta charset="UTF-8" />
 6 |     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
 7 |     <style>
 8 |       /* html, body { margin: 0;} */
 9 |     </style>
10 |   </head>
11 | 
12 |   <body>
13 |     <div class="root"></div>
14 |     <script src="./main.tsx"></script>
15 |   </body>
16 | </html>
17 | 


--------------------------------------------------------------------------------
/src/main.tsx:
--------------------------------------------------------------------------------
1 | const root = document.querySelector(".root") as HTMLDivElement;
2 | root.textContent = "Hello, {app_name}";
3 | 


--------------------------------------------------------------------------------
/tsconfig.json:
--------------------------------------------------------------------------------
 1 | {
 2 |   "include": ["src"],
 3 |   "exclude": ["node_modules"],
 4 |   "compilerOptions": {
 5 |     /* Basic Options */
 6 |     "target": "ES2017" /* Specify ECMAScript target version: 'ES3' (default), 'ES5', 'ES2015', 'ES2016', 'ES2017','ES2018' or 'ESNEXT'. */,
 7 |     "module": "commonjs" /* Specify module code generation: 'none', 'commonjs', 'amd', 'system', 'umd', 'es2015', or 'ESNext'. */,
 8 |     // "lib": [],                             /* Specify library files to be included in the compilation. */
 9 |     "allowJs": true /* Allow javascript files to be compiled. */,
10 |     "checkJs": true /* Report errors in .js files. */,
11 |     "jsx": "react" /* Specify JSX code generation: 'preserve', 'react-native', or 'react'. */,
12 |     // "declaration": true,                   /* Generates corresponding '.d.ts' file. */
13 |     // "declarationMap": true,                /* Generates a sourcemap for each corresponding '.d.ts' file. */
14 |     // "sourceMap": true,                     /* Generates corresponding '.map' file. */
15 |     // "outFile": "./",                       /* Concatenate and emit output to single file. */
16 |     // "outDir": "./",                        /* Redirect output structure to the directory. */
17 |     // "rootDir": "./",                       /* Specify the root directory of input files. Use to control the output directory structure with --outDir. */
18 |     // "composite": true,                     /* Enable project compilation */
19 |     // "removeComments": true,                /* Do not emit comments to output. */
20 |     "noEmit": true /* Do not emit outputs. */,
21 |     // "importHelpers": true,                 /* Import emit helpers from 'tslib'. */
22 |     // "downlevelIteration": true,            /* Provide full support for iterables in 'for-of', spread, and destructuring when targeting 'ES5' or 'ES3'. */
23 |     // "isolatedModules": true,               /* Transpile each file as a separate module (similar to 'ts.transpileModule'). */
24 | 
25 |     /* Strict Type-Checking Options */
26 |     "strict": true /* Enable all strict type-checking options. */,
27 |     // "noImplicitAny": true,                 /* Raise error on expressions and declarations with an implied 'any' type. */
28 |     "strictNullChecks": true /* Enable strict null checks. */,
29 |     // "strictFunctionTypes": true,           /* Enable strict checking of function types. */
30 |     // "strictPropertyInitialization": true,  /* Enable strict checking of property initialization in classes. */
31 |     // "noImplicitThis": true,                /* Raise error on 'this' expressions with an implied 'any' type. */
32 |     // "alwaysStrict": true,                  /* Parse in strict mode and emit "use strict" for each source file. */
33 | 
34 |     /* Additional Checks */
35 |     // "noUnusedLocals": true,                /* Report errors on unused locals. */
36 |     // "noUnusedParameters": true,            /* Report errors on unused parameters. */
37 |     // "noImplicitReturns": true,             /* Report error when not all code paths in function return a value. */
38 |     // "noFallthroughCasesInSwitch": true,    /* Report errors for fallthrough cases in switch statement. */
39 | 
40 |     /* Module Resolution Options */
41 |     "moduleResolution": "node" /* Specify module resolution strategy: 'node' (Node.js) or 'classic' (TypeScript pre-1.6). */,
42 |     // "baseUrl": "./",                       /* Base directory to resolve non-absolute module names. */
43 |     // "paths": {},                           /* A series of entries which re-map imports to lookup locations relative to the 'baseUrl'. */
44 |     // "rootDirs": [],                        /* List of root folders whose combined content represents the structure of the project at runtime. */
45 |     // "typeRoots": [],                       /* List of folders to include type definitions from. */
46 |     // "types": [],                           /* Type declaration files to be included in compilation. */
47 |     // "allowSyntheticDefaultImports": true,  /* Allow default imports from modules with no default export. This does not affect code emit, just typechecking. */
48 |     "esModuleInterop": true /* Enables emit interoperability between CommonJS and ES Modules via creation of namespace objects for all imports. Implies 'allowSyntheticDefaultImports'. */
49 |     // "preserveSymlinks": true,              /* Do not resolve the real path of symlinks. */
50 | 
51 |     /* Source Map Options */
52 |     // "sourceRoot": "",                      /* Specify the location where debugger should locate TypeScript files instead of source locations. */
53 |     // "mapRoot": "",                         /* Specify the location where debugger should locate map files instead of generated locations. */
54 |     // "inlineSourceMap": true,               /* Emit a single file with source maps instead of having a separate file. */
55 |     // "inlineSources": true,                 /* Emit the source alongside the sourcemaps within a single file; requires '--inlineSourceMap' or '--sourceMap' to be set. */
56 | 
57 |     /* Experimental Options */
58 |     // "experimentalDecorators": true,        /* Enables experimental support for ES7 decorators. */
59 |     // "emitDecoratorMetadata": true,         /* Enables experimental support for emitting type metadata for decorators. */
60 |   }
61 | }
62 | 


--------------------------------------------------------------------------------