https://github.com/ivanproskuryakov/messenger

Messenger app with React
https://github.com/ivanproskuryakov/messenger

javascript messenger react

Last synced: over 1 year ago
JSON representation

Messenger app with React

• Host: GitHub
• URL: https://github.com/ivanproskuryakov/messenger
• Owner: ivanproskuryakov
• License: mit
• Created: 2018-12-10T17:39:51.000Z (over 7 years ago)
• Default Branch: master
• Last Pushed: 2022-03-08T09:50:34.000Z (over 4 years ago)
• Last Synced: 2025-03-18T06:11:40.533Z (over 1 year ago)
• Topics: javascript, messenger, react
• Language: JavaScript
• Homepage: http://messenger.magazento.com/
• Size: 1.89 MB
• Stars: 78
• Watchers: 6
• Forks: 11
• Open Issues: 1
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

          
# Messenger app using React

[![Build Status](https://travis-ci.com/ivanproskuryakov/messenger.svg?branch=master)](https://travis-ci.com/ivanproskuryakov/messenger) [![PRs Welcome](https://img.shields.io/badge/PRs-welcome-brightgreen.svg?style=flat-square)](http://makeapullrequest.com)



Simple and optimized React Messenger[(See Demo)](http://messenger.magazento.com/). It includes: 

- [x] React 16.5.8

- [x] ECMAScript 6+ and JSX support

- [x] React Router v4

- [x] Component testing using [Enzyme](https://github.com/airbnb/enzyme) and [Jest](https://facebook.github.io/jest)

- [x] Code Coverage

- [x] Latest Webpack (v.4.16.5), Babel 7 and Webpack Dev Server (v.4.19.1) with Scope Hoisting enabled

- [x] Hot Module Replacement using [react-hot-loader](https://github.com/gaearon/react-hot-loader)

- [x] ES6 linting with continuous linting on file change

- [x] SASS support

- [x] Separate CSS stylesheets generation

- [x] Automatic HTML generation

- [x] Production Config

- [x] Custom Babel Preset with Decorators, Class Properties, Rest/Spread operator support

- [x] Export Separate Vendor Files

## Starting the dev server

Make sure you have the latest Stable or LTS version of Node.js installed.

1. `git clone https://github.com/ivanproskuryakov/messenger`

2. Run `npm install` or `yarn install`

3. Start the dev server using `npm start`

3. Copy files from `.dist/params/` to `app/config/params/` and adjust

3. Open [http://0.0.0.0:8080](http://localhost:8080)

## Services

Notification & signals across users are build on top of pusher, see https://pusher.com/, where:

 

- `presence-online` - share and display online presence of users

- `presence-user-X` - realtime message delivery across users of a room(chat) 

## Available Commands

- `npm start` - start the dev server

- `npm clean` - delete the dist folder

- `npm run production` - create a production ready build in `dist` folder

- `npm run lint` - execute an eslint check

- `npm test` - run all tests

- `npm run test:watch` - run all tests in watch mode

- `npm run coverage` - generate code coverage report in the `coverage` folder

## Code Coverage

The project is using the Jest Code Coverage tool. The reports are generated by running `npm run coverage`. All configurations are located in `package.json`, inside the `jest` object.

The coverage report consists of an HTML reporter, which can be viewed in the browser and some helper coverage files like the coverage json and xml file.

## Production code

Run `npm run production`. The production-ready code will be located under `dist` folder.