Coder Social home page Coder Social logo

jonndoe / socket-io-typescript-chat Goto Github PK

View Code? Open in Web Editor NEW

This project forked from luixaviles/socket-io-typescript-chat

0.0 1.0 0.0 17.54 MB

A chat application implemented using Socket.io, TypeScript, Angular and Angular Material components

Home Page: https://medium.com/dailyjs/real-time-apps-with-typescript-integrating-web-sockets-node-angular-e2b57cbd1ec1

License: MIT License

JavaScript 5.68% TypeScript 74.86% CSS 3.33% HTML 16.13%

socket-io-typescript-chat's Introduction

GitHub stars Tweet

A Socket.io Chat Example Using TypeScript

This repository contains server & client side code using TypeScript language

Blog Post

Read the blog post with details about this project: Real Time Apps with TypeScript: Integrating Web Sockets, Node & Angular

Live Demo

Try live demo: https://typescript-chat.firebaseapp.com

Support this project

  • Star GitHub repository โญ
  • Create pull requests, submit bugs or suggest new features
  • Follow updates on Twitter or Github

Running Server and Client locally

Prerequisites

First, ensure you have the following installed:

  1. NodeJS - Download and Install latest version of Node: NodeJS
  2. Git - Download and Install Git
  3. Angular CLI - Install Command Line Interface for Angular https://cli.angular.io/

After that, use Git bash to run all commands if you are on Windows platform.

Clone repository

In order to start the project use:

$ git clone https://github.com/luixaviles/socket-io-typescript-chat.git
$ cd socket-io-typescript-chat

Run Server

To run server locally, just install dependencies and run gulp task to create a build:

$ cd server
$ npm install -g gulp-cli
$ npm install
$ gulp build
$ npm start

The socket.io server will be running on port 8080

When you run npm start, this folder leverages nodemon which will automatically reload the server after you make a change and save your Typescript file. Along with nodemon, there is also a gulp watch task that you can run to reload the files but it's not necessary and is provided merely as a teaching alternative.

Run Angular Client

Open other command line window and run following commands:

$ cd client
$ npm install
$ ng serve

Now open your browser in following URL: http://localhost:4200

Server Deployment

Take a look the Wiki Page for more details about deploying on Heroku and Zeit.co.

Feel free to update that page and Readme if you add any other platform for deployment!

Forks

The Open Source community is awesome! If you're working in a fork with other tech stack, please add the reference of your project here:

Features Author Status
React + TypeScript + Material-UI client nilshartmann In Progress

Contribution

Contributions are greatly appreciated. You can contribute by adding i18n support with your language, the testing section or any other feature.

Contributors

luixaviles hughanderson4 ultrarunner theIDinside carmius Hellmy
luixaviles hughanderson4 ultrarunner theIDinside carmius Hellmy
you
You

License

MIT

socket-io-typescript-chat's People

Contributors

luixaviles avatar dependabot[bot] avatar kenionatan avatar dianjvm avatar velaia avatar firstvertex avatar oscarscholten avatar carmius avatar harshilparmar avatar suhailvs avatar theidinside avatar ultrarunner avatar

Watchers

James Cloos avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.