Your Web News in One Place

Help Webnuz

Referal links:

Sign up for GreenGeeks web hosting
July 3, 2020 07:27 pm GMT

Create node-react-docker apps easily

Every time that we start a new project, even to play around with new technologies in express/node/react. We need to configure a bunch of things, and that can be a little boring.

That's why I've created create-nrd-app. This package is a way to generate a clean and configured project with Node/Typescript in backend, React in frontend (with create-react-app) and Docker containers (with development and production mode)

Quick Overview

npx create-nrd-app my-appcd my-appdocker-compose -f docker-compose.yml up --build

(npx comes with npm 5.2+ and higher)

Then open:
http://localhost:3000/ to see your app.
http://localhost:3001/ to see your server.

Get Started Immediately

You dont need to install or configure tools like Webpack or Babel.
They are preconfigured and hidden so that you can focus on the code.

Just create a project, and youre good to go.

Creating an App

Youll need to have Node 8.16.0 or Node 10.16.0 or later version on your local development machine (but its not required on the server). You can use nvm (macOS/Linux) to easily switch Node versions between different projects.

To create a new app, you may choose one of the following methods:

npx

npx create-nrd-app my-app

(npx is a package runner tool that comes with npm 5.2+ and higher)

npm

npm init nrd-app my-app

npm init <initializer> is available in npm 6+

Yarn

yarn create nrd-app my-app

yarn create is available in Yarn 0.25+

It will create a directory called my-app inside the current folder.
Inside that directory, it will generate the initial project structure and install the transitive dependencies:

my-app docker-compose.dev.yml docker-compose.yml package.json server    .gitignore    .dockerignore    .prettierrc    .eslintrc.json    node_modules    package.json    tsconfig.json    dev.Dockerfile    Dockerfile    server.ts client     conf        conf.d           default.conf     README.md     node_modules     package.json     .gitignore     .dockerignore     dev.Dockerfile     Dockerfile     public        favicon.ico        index.html        manifest.json     src         App.css         App.js         App.test.js         index.css         index.js         logo.svg         serviceWorker.js

Once the installation is done, you can open your project folder:

cd my-app

Inside the newly created project, you can run some built-in commands:

docker-compose -f docker-compose.dev.yml up --build

Runs the app in development mode.
Open http://localhost:3000 to view your app in the browser.
Open http://localhost:3001 to view your server in the browser.

The page will automatically reload if you make changes to the code.

docker-compose -f docker-compose.yml up --build

Runs the app in production mode.
Open http://localhost:3000 to view your app in the browser.
Open http://localhost:3001 to view your server in the browser.

Thanks for reading, I'll love to see if you liked it :D


Original Link: https://dev.to/brito/create-node-react-docker-apps-easily-5b4a

Share this article:    Share on Facebook
View Full Article

Dev To

An online community for sharing and discovering great ideas, having debates, and making friends

More About this Source Visit Dev To