https://github.com/jwdev66/socket_chat

https://github.com/jwdev66/socket_chat

express material-ui react redux redux-thunk socket-io

Last synced: 3 months ago
JSON representation

• Host: GitHub
• URL: https://github.com/jwdev66/socket_chat
• Owner: jwdev66
• Created: 2021-03-18T16:27:47.000Z (over 5 years ago)
• Default Branch: master
• Last Pushed: 2021-03-18T16:28:24.000Z (over 5 years ago)
• Last Synced: 2025-05-15T13:10:34.694Z (about 1 year ago)
• Topics: express, material-ui, react, redux, redux-thunk, socket-io
• Language: JavaScript
• Homepage:
• Size: 5.1 MB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

          
# React-redux socket.io Chat

This is my PET Chat project that I'd like to share with you.

Included `Webpack 4` `babel 7` `styled-components` `redux` `redux-thunk` `socket.io`

# Installation

0) Clone the branch you need

1) Install dependencies via npm `npm i` or yarn `yarn install`.

2) npm run build

3) Start web server `npm run server`.

4) Open 2 Browser tabs and enter 2 different nicknames. Navigate to [http://localhost:5001](http://localhost:5001)

4) Type anything in a chat.

# Location of stuff

    .

    ├── server/                 # Server logic with socket.io

    ├── src/                    # App folder with all developer stuff

    │   ├── actions/            # Redux actions used api/ functions

    │   ├── api/                # Axios requests logic

    │   ├── components/         # All components used in this project

    │   ├── constants/          # Redux constants used in actions/

    │   ├── pages/              # The layout of home page

    │   ├── reducers/           # Redux reducers

    │   ├── store/              # Redux store with initial state

    │   ├── static/             # Used to store fonts, icons, images

    │   └── ...

    ├── webpack/                # Modules for webpack I used

    ├── webpack.config.js       # All webpack settings

    └── ...

# Build production

If you want to build a production version of my app you need to type

`npm run build` || `yarn build`

This will create dist folder where everything will be compressed and minified.