You are currently viewing Build a Chat App – React Tutorial Course

Build a Chat App – React Tutorial Course



Chat is eating the world and React is eating front-end development, so why not learn React through building a chat app?

That’s exactly what this course will enable you to do: at the end of it you’ll both have a solid understanding of React.js and your very own personalized chat application. The chat will be built using the Chatkit API, meaning you don’t have worry about doing any back-end coding.

🔗Check the interactive version of this course on Scrimba: https://scrimba.com/g/greactchatkit

⭐️ Course Contents ⭐️
⌨️ 0:00 —1. Course Introduction
⌨️ 2:42 —2. Component Architecture
⌨️ 5:05 —3. Codebase Architecture
⌨️ 10:30 —4. MessageList Component
⌨️ 15:13 —5. Intro to Chatkit
⌨️ 16:34 —6. Connecting to Chatkit
⌨️ 24:54 —7. State and Props
⌨️ 32:22 —8. Message Component
⌨️ 37:02 —9. SendMessageForm Component
⌨️ 44:19 —10. Broadcasting Messages
⌨️ 49:36 —11. RoomList Component
⌨️ 53:50 —12. Subscribe to Rooms
⌨️ 1:01:41 —13. Order and Highlight Rooms
⌨️ 1:05:44 —14. Adding Autoscroll
⌨️ 1:11:39 —15. NewRoomForm Component
⌨️ 1:20:39 —16. Creating your own Chat App
⌨️ 1:23:37 —17. CSS Grid
⌨️ 1:29:05 —18. CSS Variables
⌨️ 1:32:02 —19. Outro

🐦You can follow the course creator Per Harald Borgen on Twitter here: https://twitter.com/perborgen

Learn to code for free and get a developer job: https://www.freecodecamp.org

Read hundreds of articles on programming: https://medium.freecodecamp.org

And subscribe for new videos on technology every day: https://youtube.com/subscription_center?add_user=freecodecamp

source

This Post Has 26 Comments

  1. Elias Prado

    THIS TUTORIAL DONT TEACH YOU HOW TO INSTALL THE ENVIRONMENT!!!!!!!!!!!!!!!!!

  2. T11l12

    can i pay someone to make a functioning chat app for me?

  3. Manu Mohanan

    What's the alternative to ChatKit? It seems ChatKit has come to end of life.

  4. Tyler J. Mos

    Anyone know how to locate the instanceLocator? I cant seem to find it in pusher.

  5. Danial Arshad

    I heard that chatkit is no longer available. What should I do in that case?

  6. Bill

    Chatkit has shut down. What would you suggest as an alternative?

  7. Surekha Wanawe

    You should write the code without just explaining the already written code. BDW Nice video.

  8. It seems that Pusher doesn't support Chatkit anymore. Is there any similar replacement for it, so one could follow the course?
    thx

  9. F R

    Is this a stencil for an app or the actual code?

  10. Vampirejs

    Can you build the same app using vuejs or svelte

  11. Quick Tuts

    It would be nice to see the same course but with React hooks and an alternative to Pusher's Chat-api

Leave a Reply