A Chat App with Socket.io and ReactJS Tutorial-ish

Twitter

Commands:
//Install create-react-app globally
npm install -g create-react-app

create-react-app chat-app

// install concurrently and nodemon
npm install —save-dev concurrently nodemon

React Snippets

Styles

NodeJS

ReactJS

coding setup 2:30
socket setup 4:30
Layout Component 11:26
io-connection client 13:25
import styles 16:36
Event constants 17:32
Login/Functions 19:09
LoginForm Component 27:45

[snwdn]

Thank you for this, very good for people who already know some React. Only suggestion is change console to something easier to look at. Red is hard on the eyes!

[dgrob]

I feel like I'm going to learn a lot from you, thanks for your time and effort brother

[ziaulhasanmozumder]

hey man just found your channel ... you did such a great job with this series, , , i hope you make more tuts like this, this has been a big help man, , , keep up ur good work

[ebrahimkeybondorian]

Thanks a lot, great job by you, it was awesome tut series.

[bantinggamer]

dude thanks so much for making this tutorial. im loving it!

[nathantelford]

can you explain the change in the script (9:44) in more detail? mine isn't working, and I'm really not sure what Iv'e done let alone what to do to fix it.

[michaelparaskakis]

I'm curious to know what keyboard shortcut (or sequence of shortcuts) were used that allowed Leon to modify the Events.js file like he did.

[darshanjain]

If you guys faced error using npm create react app use npx instead of npm

[tabaicanking]

thanks bro but how do i do delete in javascript ive been trying that and its not working for me. can you point me in the right direction

[deux]

if you found this issue “Cannot read property 'emit' of undefined”:

Just change 'io.emit(...)' to 'socket.emit(...) => module.exports = function(socket) { ... }

thank me later...

[herbertk]

Thanks for sharing keep up good work and i cant wait to subscribe

[hossam_mourad]

Thanks for the video, I've a question what is the Date.now() do as a param to new Date()? isn't that equivalent to just new Date()?

[kunalmandalia]

Hey Leon, just wanted to say good job. You're following some good practices.

[alexyap]

just need clarification on something, in newer versions of React aren't you able to just do this.state = {} right away without calling the constructor function?

[akshayanagalakshmi]

Hi Leon, It seems this chat app does not use express. So, to add the functionality of sending files and images how to add express in it?

[biemarfernandezacunaoficia]

hello, a question this video is giving me errors, can you help me please

[kayceecodes]

Hey thanks for the vids, are you building backend in this series too for the chat app?

[vamshidharreddy]

at 45min how are you able to console.log
i dont see anything in my console except connected

[zahinhasan]

I followed along the tutorial but cant the console log for connected and the socket ID cant be found. Anyone facing the same issue?

[Bloddhunter]

Hi Leon, getting this error: socket.on(VERIFY_USER, (nickname, callback) => {
^

ReferenceError: socket is not defined. In my SocketManager.js. Basically i'm not getting any socket.id