Tutorial
| time | section |
|---|---|
| 00:00 | Heads up |
| 00:14 | Intro |
| 01:55 | The 4 steps |
| 02:11 | Step 0: Install node.js |
| 03:37 | Step 1: Open the project folder in your terminal |
| 05:29 | Step 2: Install dependencies |
| 07:35 | Running the project |
| 08:17 | Step 3: Run system B |
| 09:34 | Step 4: Run system A |
| 11:04 | Making changes |
| 11:46 | System A changes |
| 13:31 | System B changes |
| 15:36 | Localization files |
| 16:26 | Localize system A |
| 17:19 | Localize system B |
| 17:58 | Help fix this |
| 18:43 | Conclusion |
The 4 steps
Step 0: Install Node.js + NPM if it's not already on your machine
Confirm by executing node -v in your terminal. I currently have v14. Earlier versions should work but you might run into problems, the closer the versions are the better…
Step 1: Open the project folder in in your terminal
From the repository page, click 'Download ZIP' under 'Code'.
Alternatively, run git clone https://github.com/wikiavec/hyperdraft.
Step 2: Install dependencies
Execute npm run setup. This will:
- run
npm installwithout modifying thepackage.jsonfile - clear any
package-lock.jsonfile - copy the
.env-sampleto.env
Step 3: Start system B
Execute npm run watch. This will:
- build the final JavaScript from Svelte files
- watch for changes to re-build automatically
Step 4: Start system A
Execute npm start. This will:
- start a node.js server
- allow the site to be accessible at http://localhost:3000
- watch for changes to reload when certain files are changed
Other notes
Avoid making changes before writing tests. See Testing logic and interfaces.
See Universal project folder structure.
Localization files (i18n.xx.yml) will not trigger any updates or be visible on reload. For system A: kill the process in your terminal with Ctrl+c and execute npm start again; if you would like to improve this, make a pull request to OLSKExpress. For system B: make a change to any .svelte file.
Part of Project workflow.