Development of Web-based Sales Inventory Program

I would like to post as we proceed with the goal of creating a web-based sales inventory program.

First, set the development environment in Windows

Go to the nodejs.org website.

Install node.js v20.17.0.

Node.js must be installed to use npm.
npm is the package manager for node.js.

Advantages of Nodejs
1)asynchronous programming
It works using an asynchronous event-based architecture, which can handle multiple tasks at once, making it ideal for I/O-intensive applications.

2)a fast pace
Node.js using the V8 JavaScript engine provides high performance.

3)Using a Single Language
The entire stack can be developed using JavsScript.

4)Manage packages and modules through NPM.
5)Scalability
It is suitable for developing highly scalable applications. Asynchronous architectures and event-based models are easy to handle large-scale traffic.
6)It has a healthy development ecosystem.
7)Easy Web Application Development

Trying to use node.js for background running.

The front end wants to use react, vite, typecript, tailwildCSS.

Vite is a build tool and features that it uses ESM methods without bundling when developed locally, so the local server runs very fast.

react is a web framework that is used to create user interfaces as part of the JavaScript library. It is a front-end library provided by Facebook.

Characteristics of react

1)Data Flow
Data flow has a one-way data flow that flows only in one direction.
2)Component-based architecture
Create a UI (View) by splitting multiple components.
3)Virtual DOM
DOM stands for Document Object Model.
Create a virtual DOM every time an event occurs. Each time you redraw it, you can compare it with the actual DOM and the state before and after, reflecting only the smallest changes that need to be changed in the actual DOM to improve the efficiency and speed of the app.

4)Props와 State
Props: The data that is transferred from the parent component to the child component.
State : Declares inside the component and can change the value inside.

5)JSX
It is an extended grammar of Javascript.

Setting the environment

$ npm init vite@latest jangbu -- --template react-ts
$ cd front
$ npm i

Tailwind CSS Settings

$ npm install -D tailwindcss postcss autoprefixer
$ npx tailwindcss init -p

Use Visual Studio code.

A long way to go, but a thousand miles a day starts with one step

Thank you for reading my post. 😀