Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/luixaviles/socket-io-typescript-chat
A chat application implemented using Socket.io, TypeScript, Angular and Angular Material components
https://github.com/luixaviles/socket-io-typescript-chat
angular angular-material2 chat nodejs socket typescript
Last synced: about 1 month ago
JSON representation
A chat application implemented using Socket.io, TypeScript, Angular and Angular Material components
- Host: GitHub
- URL: https://github.com/luixaviles/socket-io-typescript-chat
- Owner: luixaviles
- License: mit
- Created: 2016-11-11T01:51:03.000Z (about 8 years ago)
- Default Branch: master
- Last Pushed: 2023-04-22T05:06:57.000Z (over 1 year ago)
- Last Synced: 2024-08-01T19:56:18.394Z (4 months ago)
- Topics: angular, angular-material2, chat, nodejs, socket, typescript
- Language: TypeScript
- Homepage: https://medium.com/dailyjs/real-time-apps-with-typescript-integrating-web-sockets-node-angular-e2b57cbd1ec1
- Size: 18.8 MB
- Stars: 823
- Watchers: 38
- Forks: 276
- Open Issues: 43
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
- my-awesome-list - socket-io-typescript-chat
README
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](https://medium.com/dailyjs/real-time-apps-with-typescript-integrating-web-sockets-node-angular-e2b57cbd1ec1)## Live Demo
Try live demo: [https://typescript-chat.firebaseapp.com](https://typescript-chat.firebaseapp.com)# Support this project
- Star GitHub repository :star:
- Create pull requests, submit bugs or suggest new features
- Follow updates on [Twitter](https://twitter.com/luixaviles) or [Github](https://github.com/luixaviles)![](https://luixaviles.com/assets/images/posts/typescript-chat/typescript-chat.gif?raw=true)
# Running Server and Client locally
## PrerequisitesFirst, ensure you have the following installed:
1. NodeJS - Download and Install latest version of Node: [NodeJS](https://nodejs.org)
2. Git - Download and Install [Git](https://git-scm.com)
3. Angular CLI - Install Command Line Interface for Angular [https://cli.angular.io/](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:
```bash
$ 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:
```bash
$ 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](https://nodemon.io/) 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:
```bash
$ cd client
$ npm install
$ ng serve
```Now open your browser in following URL: [http://localhost:4200](http://localhost:4200/)
# Server Deployment
Take a look the [Wiki Page](https://github.com/luixaviles/socket-io-typescript-chat/wiki) 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](https://github.com/nilshartmann/socket-io-typescript-chat/tree/react-client/client-react) | [nilshartmann](https://github.com/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
[](https://github.com/luixaviles) | [](https://github.com/hughanderson4) | [](https://github.com/ultrarunner) | [](https://github.com/theIDinside) | [](https://github.com/carmius) | [](https://github.com/Hellmy) |
:---: |:---: |:---: |:---: |:---: |:---: |
[luixaviles](https://github.com/luixaviles) |[hughanderson4](https://github.com/hughanderson4) |[ultrarunner](https://github.com/ultrarunner) |[theIDinside](https://github.com/theIDinside) |[carmius](https://github.com/carmius) |[Hellmy](https://github.com/Hellmy) |[headwinds](https://github.com/headwinds) |[](https://github.com/luixaviles) |
:---: |
[You](https://github.com/luixaviles) |## License
MIT