You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
This is a _**TypeScript**_ project that uses _**React**_. You'll just need _[**Node.js**](https://nodejs.org/en) and _**npm**_ installed on your development machine.
22
-
Although, this is sufficient to run, build, and test the project as a whole, you might need some
23
-
extra tools for other development tasks.
21
+
This is a _**TypeScript**_ project that uses _**React**_. You'll just need
22
+
_[**Node.js**](https://nodejs.org/en)_and _**npm**_ installed on your development machine.
23
+
This is sufficient to run, build, and test the project as a whole, but you might need extra tools for other development tasks.
24
24
25
-
You'll need _**tsc**_ (_TypeScript Compiler_) to manually compile `.ts` files. You'll need
26
-
_**ts-node**_ (_Node.js executable for TypeScript_) to manually execute `.ts` scripts directly. Finally,
25
+
You'll need _**tsc**_ (_TypeScript Compiler_) to manually compile `.ts` files, and
26
+
_**ts-node**_ (_Node.js executable for TypeScript_) to manually execute .ts scripts directly.
27
27
28
-
Once _**npm**_ is installed, to install the above, run
28
+
Finally, once_**npm**_ is installed, to install the above, run
29
29
30
30
```bash
31
31
npm i -g typescript
@@ -40,7 +40,7 @@ Check installation using
40
40
node -v && npm -v && tsc -v && ts-node -v
41
41
```
42
42
43
-
Output should look like
43
+
Expected output:
44
44
45
45
```bash
46
46
v23.7.0
@@ -51,67 +51,66 @@ v10.9.2
51
51
52
52
## Commands
53
53
54
-
After you are set-up, the steps you take depend on what you want to do:
54
+
After setup, the steps you take depend on what you want to do:
55
55
56
56
-**Run a development server**
57
+
1. To install all the dependencies (in `package.json`), run
57
58
58
-
1. To install all the dependencies (in `package.json`), run
59
+
```bash
60
+
npm install
61
+
```
59
62
60
-
```bash
61
-
npm install
62
-
```
63
+
2. Run _React scripts_.
64
+
- For unoptimized development serving, run
63
65
64
-
2. Run _React scripts_.
66
+
```bash
67
+
npm run dev
68
+
```
65
69
66
-
- For unoptimized development serving, run
70
+
Visit `localhost:5173`in a browser to view the web page served.
67
71
68
-
```bash
69
-
npm run dev
70
-
```
72
+
- For generating a generic production build, run
71
73
72
-
Visit `localhost:5173` in a browser to view the web page served.
74
+
```bash
75
+
npm run build
76
+
```
73
77
74
-
- For generating a generic production build, run
78
+
- For generating a production build under the subdirectory `/www-v2`, run
75
79
76
-
```bash
77
-
npm run build
78
-
```
80
+
```bash
81
+
npm run build
82
+
```
79
83
80
-
- For generating a production build under the subdirectory `/www-v2`, run
84
+
- For serving the last production build (`dist` folder), run
81
85
82
-
```bash
83
-
npm run build
84
-
```
86
+
```bash
87
+
npm run preview
88
+
```
85
89
86
-
- For serving the last production build (`dist` folder), run
87
-
88
-
```bash
89
-
npm run preview
90
-
```
91
-
92
-
Visit `localhost:4173` in a browser to view the web page served.
90
+
Visit `localhost:4173`in a browser to view the web page served.
93
91
94
92
## Editor
95
93
96
-
_All code is just plain text, so it doesn't really matter what you use to edit them._ However,
97
-
using modern, feature-rich IDEs/text-editors like:
94
+
_All code is just plain text, so any editor works._ However, using modern,
[_**Visual Studio Code**_](https://code.visualstudio.com/), etc. makes life way easier. These come
103
-
with a directory-tree explorer, and an integrated terminal, at the very least, while having support
104
-
for plugins/extensions to expand their functionality.
100
+
[_**Visual Studio Code**_](https://code.visualstudio.com/), etc. makes development way easier.They provide a directory-tree explorer,
101
+
integrated terminal, and support for plugins/extensions to expand their functionality.
105
102
106
103
Some (non-exhaustive) benefits of using these are _syntax highlighting_,
107
104
_warning/error annotations_, _formatting_, _auto-refactoring_, tons of customizable
108
105
_keyboard shortcuts_, etc.
109
106
110
-
_**Visual Studio Code**_ (_**VSCode**_) is currently the most-popular code editor for reasons like
111
-
being _lightweight_, _cleaner_, large marketplace of _extensions_, integrated _source control_
112
-
features, _debugger_, _remote explorer_ support, _regular expression_ based find/replace, etc.
107
+
_**Visual Studio Code**_ (_**VSCode**_) is currently the most popular code editor due
108
+
to being _lightweight_, _clean_, having a large _extensions_ marketplace, integrated
109
+
_source control_ features, a _debugger_, _remote explorer_ support, and
110
+
_regular-expression-based find/replace_.
113
111
114
-
Recommended extensions for this project are `Babel JavaScript`, `ESLint`, `Git Graph`,`GitLens`, `markdownlint`, `Prettier`, `Tailwind CSS IntelliSense`, and `SVG`.
112
+
Recommended extensions for this project are `Babel JavaScript`, `ESLint`, `Git Graph`,
113
+
`GitLens`, `markdownlint`, `Prettier`, `Tailwind CSS IntelliSense`, and `SVG`.
115
114
116
115
All that, however, shouldn't necessarily stop you from using _**Emacs**_, _**Nano**_, or _**Vim**_,
0 commit comments