Differences

This shows you the differences between two versions of the page.

--- node:node [2022/04/22 16:57] – utedass
+++ node:node [2024/08/19 10:24] (current) – [Getting started] utedass
@@ Line 7: / Line 7: @@
 | JSX | HTML-style coding in JS |
 | fastify | Node framework for backend |
+| HMR | Hot Module Replacement, reloads page on save using websocks or something |
+| Routing | Moving user to different pages |
+===== Libraries and frameworks =====
+^ Name ^ Category ^ Description ^
+| vite | Build environment? | Makes wokring with front end easier. Helps with project generation, running dev code etc. |
+| react | Front-end framework | Uses JSX and has a lot of other stuff |
+| MUI | Components | Front end component and layout framework |
+| bootstrap | Components | Front end component and layout framework |
+===== VS Code =====
+^ Plugin name ^ Description ^
+| Prettier - Code formatter  | For formatting on save, needs some setup to work |
+| ES7+ React/Redux/React-Native snippets | Nice snippets for react, for example rfce |
+| indent-rainbow | Easier to read indents |
+^ Hotkey ^ Description ^
+| c-d | Find similar word and enter multi-cursor edit mode, press multiple times |
+|  |  |
+|  |  |
+===== Resources =====
+^ Link ^ Description ^
+| [[https://react.dev]] | React docs |
+| [[http://jsonplaceholder.typicode.com/]] | Fake API for testing calls |
 ===== Getting started =====
+<code bash>
+npm create vite@latest
+</code>
+Follow the guide. Pick for example react with JavaScript + SWC
+Then run
+<code bash>
+cd proj-dir
+npm install
+npm run dev
+</code>
+===== Getting started  -- OLD =====
 <code bash>