source: js/human_3d_alignment/README.txt @ 943

Last change on this file since 943 was 881, checked in by Maciej Komosinski, 5 years ago

Initial, prototype version of a javascript app to test how humans align two 3D structures

File size: 1.7 KB
Line 
1This project is the app for performing an experiment where humans align two 3D ball-and-stick structures (models).
2
3
4Before creating any widgets or other components that use Framsticks SDK,
5the SDK needs to be prepared and present - see ../sdk/README.txt.
6
7Once you have Framsticks SDK compiled to js, run the following commands in project root:
8        bash
9        npm install # for installing all required dependencies and preparing gulp task manager
10        gulp        # for compiling all JSX and ES2015 files
11       
12To generate documentation:
13        bash
14        gulp doc
15
16To synchronize the browser with your builds:
17        bash
18        gulp browser-sync
19
20To just check the code for potential errors, use ESLint:
21        bash
22        gulp eslint
23
24To make ESLint more or less strict, edit the .eslintrc file. Popular options for ES2015 and React:
25 - Official ESLint rules: https://eslint.org/docs/rules/
26 - Use ESLint Like a Pro with ES6 and React: http://www.zsoltnagy.eu/use-eslint-like-a-pro-with-es6-and-react/
27 - eslint-plugin-react: https://www.npmjs.com/package/eslint-plugin-react
28 - eslint-plugin-babel: https://github.com/babel/eslint-plugin-babel
29
30
31You can edit sources with Visual Studio Code. It will allow you to debug with
32Google Chrome after a basic setup. Debugging (using Debugger for Chrome Extension)
33is facilitated by the JSON file in the .vscode directory.
34
35The .vscode directory is optional and can be removed or replaced by an automatic JSON generator.
36Still, it already contains a universal configuration for easy debugging.
37
38If breakpoints do not work for you, there may be a problem with source
39mapping - look for solutions in gulp-sourcemaps documentation (https://github.com/gulp-sourcemaps/gulp-sourcemaps)
40and VS Code Debugger for Chrome (https://github.com/Microsoft/vscode-chrome-debug).
Note: See TracBrowser for help on using the repository browser.