Secret Language App - React, Tailwind.css

Hey Guys, this video is a collaboration with Max Programming where he will be teaching how to create an awesome secret language app using React and Tailwind CSS and will be hosted on Netlify.

This is a very good project for beginners in Javascript and is starting to learn Reactjs. This project also implements Dark Mode using Tailwind CSS. More information about the project like the resources used and the timestamps will be down below, so feel free to check that out.

If you liked this video, feel free to check out Max Programming's channel, where he has a lot of React js tutorials and more programming related content:

Thanks a lot to all of you guys for watching this video. Hope you enjoyed this video. Please subscribe to the channel if you want more videos like this and also leave a like 👍 if you liked this video. See you in the next video!

Timestamps:
00:00 - Introduction
00:21 - App demo
01:21 - Secret text algorithm
02:57 - Tailwind CSS
04:08 - Creating the React app
06:50 - TailwindCSS setup
10:55 - The Header component
16:42 - The Info component
18:57 - Styling parent div
19:20 - Div for textboxes
20:47 - The TextInput component
26:36 - The CopyButton component
32:54 - Creating the textarea element
36:25 - Styling the textarea element
38:39 - Using a plugin for border gradient
43:00 - Adding state and props
46:35 - Function to translate text
01:08:10 - Using useEffect to call the function
01:10:49 - Final touches
01:11:31 - Copying text with the button
01:17:13 - Adding dark mode
01:22:42 - Responsive textareas
01:25:11 - Publishing to GitHub
01:27:56 - Deploying to Netlify
01:32:07 - Conclusion

Resources mentioned in the video:

If you want to support me, you could Buy Me a Coffee for just $2. If you can support me more, I would appreciate it a lot, however, If you are not able to support me, it is totally fine. You could support me in any other way you think is possible.

📕 My Favourite Designing Book:
Use Promo Code - "awesomeui200" to get 20% OFF

⚙ Equipment I use:

Get in touch:
If you follow me on Instagram(shanjai_raj) or Twitter(shanjai_raj), drop me a message saying you came from my Youtube channel. It'll help me to know my audience and connect with each and every one of you.

If you want to support me:

Thanks for watching, and I'll see you in my next video!

[vikasni]

Hii bro how are you, im vikas, great to see you back here

[MaxProgramming]

Really nice to collaborate with you Shanjai. The audience will love it 😃