React-Express-Mysql

Description

This project is a full-stack JavaScript application built with React for the front-end and Express.js for the back-end. It uses MySQL for database management and Axios for handling HTTP requests. The application is bundled and transpiled using Webpack and Babel, respectively. Jest is used for testing, and dotenv is used for managing environment variables. The project also utilizes several other packages to enhance development and production workflows.

Project Dependencies

This project utilizes several packages to enhance development and production workflows.

DevDependencies

copy-webpack-plugin: A webpack plugin to copy individual files or entire directories to the build directory.
html-webpack-plugin: A webpack plugin that simplifies creation of HTML files to serve your webpack bundles.
jest: Jest is a delightful JavaScript Testing Framework with a focus on simplicity.
nodemon: A tool that helps develop node.js based applications by automatically restarting the node application when file changes in the directory are detected.
supertest: A library for testing HTTP servers, providing a high-level abstraction for testing HTTP.
terser-webpack-plugin: A webpack plugin that minifies your JavaScript.
webpack: Webpack is a static module bundler for modern JavaScript applications.
webpack-cli: Webpack's command-line interface.
webpack-dev-server: Serves a webpack app and updates the browser on changes.
webpack-merge: A webpack plugin to merge configuration objects.
webpack-node-externals: A small webpack plugin to exclude all modules in the node_modules directory from the bundled file.

Dependencies

@babel/core: Babel compiler core.
@babel/preset-env: A Babel preset that compiles ES2015+ down to ES5 by automatically determining the Babel plugins and polyfills you need based on your targeted browser or runtime environments.
@babel/preset-react: Babel preset for all React plugins, for example, converts JSX and removes React.PropTypes.
@emotion/react: A library designed for writing css styles with JavaScript.
@emotion/styled: A library for styled components using Emotion.
@mui/material: A popular React UI framework implementing Google's Material Design.
axios: Promise based HTTP client for the browser and node.js.
babel-loader: This package allows transpiling JavaScript files using Babel and webpack.
bcrypt: A library to help you hash passwords. Bcrypt is a password-hashing function designed by Niels Provos and David Mazières, based on the Blowfish cipher.
cookie-parser:A middleware that parses cookies attached to the client request object. It allows you to work with cookies through req.cookies. If you pass a secret string, it can also handle signed cookies, which are available through req.signedCookies.
dotenv: Dotenv is a zero-dependency module that loads environment variables from a .env file into process.env.
express: Fast, unopinionated, minimalist web framework for Node.js.
express-mysql-session: A MySQL session store for Express.
express-session: Simple session middleware for Express.
jsonwebtoken: An implementation of JSON Web Tokens. This is a compact, URL-safe means of representing claims to be transferred between two parties.
mysql2: MySQL client for Node.js with focus on performance. Supports prepared statements, non-utf8 encodings, binary log protocol, compression, ssl and much more.
newrelic: New Relic's official Node.js agent. This package instruments your application for performance monitoring with New Relic.
nodemailer: A module for Node.js applications to easily send emails.
react: A JavaScript library for building user interfaces.
react-dom: Serves as the entry point to the DOM and server renderers for React.
react-router-dom: DOM bindings for React Router.
winston: A logger for just about everything.
winston-daily-rotate-file: A transport for winston which can rotate files by day, month, or year.

Installation

To install the necessary dependencies, run the following command:

    npm install

Scripts

    npm test - Run tests with Jest

    npm run build - Create a production build with webpack and create a package.json file with the needed dependencies

    npm run dev - Create a development build with webpack and run the server

License

This project is licensed under the ISC license.

File Structure

React-Express-Mysql/
├── dist/
│   ├── public/
│   │   └── index.html
│   ├── client.js
│   ├── client.js.LICENSE.txt
│   ├── server.js
│   └── package.json
├── public/
│   └── index.html
├── src/
│   ├── client/
│   │   ├── components/
│   │   │   ├── Button.js
│   │   │   ├── Footer.js
│   │   │   ├── Navbar.js
│   │   │   └── Sidebar.js
│   │   ├── layouts/
│   │   │   ├── ContentOnly.js
│   │   │   ├── FullLayout.js
│   │   │   └── NoSidebarLayout.js
│   │   ├── pages/
│   │   │   ├── Admin.js
│   │   │   ├── Login.js
│   │   │   ├── ResetPassword.js
│   │   │   ├── Signup.js
│   │   │   └── Teste.js
│   │   ├── store/
│   │   │   ├── states
│   │   │   │   ├── authState.js
│   │   │   │   └── envState.js
│   │   │   ├── appContext.js
│   │   │   └── combinedState.js
│   │   ├── theme/
│   │   │   └── original.js
│   │   ├── wrappers/
│   │   │   ├── LoginWrapper.js
│   │   │   ├── PrivateWrapper.js
│   │   │   └── SettingsWrapper.js
│   │   ├── index.js
│   │   └── layout.js
│   └── server/
│       ├── config/
│       │   ├── auth.js
│       │   ├── autoRenewToken.js
│       │   ├── dbpool.js
│       │   ├── email.js
│       │   ├── logger.js
│       │   └── sessionConfig.js
│       ├── main/
│       │   ├── mainRoutes.js
│       │   └── mainRoutes.test.js
│       ├── settings/
│       │   └── settingsRoutes.js
│       ├── user/
│       │   ├── userRoutes.js
│       │   └── userRoutes.test.js
│       └── server.js
├── generatePackageJson.js
├── newrelic.js
├── package-lock.json
├── package.json
├── webpack.commmon.js
├── webpack.dev.js
├── webpack.prod.js
└── README.md

besmarques/React-Express-Mysql