A starter template for a Node/Express and React project.
- Node 12
- Docker Desktop
- Required only if you need to create a Docker image and to run the Docker image locally.
npm run setup
npm run start
- Open browser to http://localhost
- To run on specific port:
PORT=4242 npm run start
- Open browser to http://localhost:4242
Stater code is located in server/src/server.ts
Stater code is located in:
react/src/App.tsx
react/src/components/HelloWorld/index.tsx
You can load images as shown in the index.tsx
file.
The Shared folder is where you can place shared files (ex. types, interfaces, enums...etc).
You can import them in either project using: '@shared/'
.
Example: import { SocketMessage } from '@shared/Message';
The project shows a very basic example of a Websocket connection between the Node server and React app. Code is located in:
server/src/server.ts
react/src/components/HelloWorld/index.tsx
-
Build for Production
npm run build
- This will create a folder called 'dist' in this directory with two folders 'server' and 'react'.
- To run:
node ./dist/server/dist/server.js
- Open browser to http://localhost
- To run on specific port:
PORT=4242 node ./dist/server/dist/server.js
- Open browser to http://localhost:4242
-
Build for Docker
npm run build
docker build -t sage3/nodeserver .
docker run -p 80:80 -d sage3/nodeserver
- Open Browser to http://localhost
- To run on specific port:
docker run -p 4242:80 -d sage3/nodeserver
- Open Browser to http://localhost:4242