This shows you the differences between two versions of the page.
| Both sides previous revision Previous revision Next revision | Previous revision | ||
|
ra:frontend [2018/10/05 15:38] koubel |
— (current) | ||
|---|---|---|---|
| Line 1: | Line 1: | ||
| - | Most of new front ends are single page applications based on React, Mobx. | ||
| - | ====== Typical workflow ====== | ||
| - | Typical workflow | ||
| - | |||
| - | * clone package | ||
| - | * ''%%npm install%%'' by package.json | ||
| - | * ''%%npm run dev%%'' mostly by webconfig | ||
| - | |||
| - | %%run%% and %%dev%% are npm scripts defined in package.json | ||
| - | |||
| - | There can be many other task e.g. for running test, pritty prints for source code etc. | ||
| - | |||
| - | ====== Minimum NPM ====== | ||
| - | |||
| - | Install package node_modules and add into package.json as dependency. | ||
| - | |||
| - | > npm i package-name | ||
| - | |||
| - | Install package node_modules and add into package.json as developer dependency | ||
| - | |||
| - | > npm i --save-dev package-name | ||
| - | | ||
| - | Install package in particular version | ||
| - | |||
| - | > npm i --save-dev package-name@^3.2.1 | ||
| - | | ||
| - | Uninstall package | ||
| - | |||
| - | > npm un package-name | ||
| - | | ||
| - | Show version of installed package | ||
| - | |||
| - | > npm ls package-name | ||
| - | | ||
| - | For semantic versionning see [[https://docs.npmjs.com/misc/semver|npm documentation]] | ||
| - | | ||
| - | For run project local scripts from %%node_modules%% dir, use %%npx%% e.g. | ||
| - | |||
| - | Runs webpack from project local node_modules for building the project | ||
| - | |||
| - | > npx webpack | ||
| - | |||
| - | Runs jest from project local node_modules for running test suite | ||
| - | |||
| - | > npx jest | ||
| - | | ||
| - | ====== Webpack, Typesript configuration ====== | ||
| - | |||
| - | Webpack is responsible for module loading. [[https://www.typescriptlang.org/docs/handbook/modules.html|Modules]] are essential concept of modern javascript. | ||
| - | |||
| - | Typescript is superset of javascript, which is compiled into real javascript e.g. es5 - 'classic' javascript e.g. without classes, es6 classes, const variables, esnext. | ||
| - | Information about typesript | ||