Building an event calendar - React Challenge

Sign Up for BrightData → brdta.com/cosdensolutions
Source Code → github.com/cosdensolutions/co...
Join The Discord! → discord.cosdensolutions.io
VSCode Theme | Font → Material Theme Darker | Menlo, Monaco "monospace"
In this video we challenge ourselves to build an event calendar in React from scratch! This React code challenge series is designed to complete React challenges and see what cool stuff we can build. You can follow along or you can attempt to complete the React challenge yourself by checking out the repository. If you get stuck, the solution is in the GitHub repository as well!

[@romancalderon]

Great challenge, please do more like this. Inspired to make my own calendar app!

[@HerlonCosta]

I will have to watch this one a few times to understanding it well. Excellent class, very rich. Thanks for that!

[@madhanr5622]

Nice video❤.Please continue this series.

[@prashlovessamosa]

Thanks for sharing please share more challenges in future.

[@jarolriera2856]

I am building a reservation calendar from scratch and this really helped me a lot. Thank you, your content is great!

[@ositaka]

Your React Challenges is a super idea 💡

[@yaa4500]

Such a good challenge. The best react youtuber i’ve ever seen.

[@jech33]

There you go! Nice sound and awesome vid 🤟🏻

[@akashthoriya]

Learning a lot from your videos, Thank you! We need more videos on Design Patterns. [Nowadays nobody is creating such videos with great details like you]

[@cosdensolutions]

They're coming!

[@akashthoriya]

@@cosdensolutions Thank You!!!

[@Shaheer-xs5os]

Damn, date-fns in awesome... I think I am using it in my own event calendar... thanks for the video man!

[@user-yr3yw6vv5v]

oh...this is great video! i wanted to implement like this event via react-day-picker, but i didnt know how to do. thanks!

[@mohamedsalimbensalem6118]

i'm junior developer with 1 year of experience, ive watched all your videos and learned a lot throughout the journey, looking to see all your next videos, keep it up cosden

[@codewithsunil5990]

Need more challenges like this

[@AnuMessi10]

Great content as always, you can come up with such challenges that are also asked in machine coding rounds during the interviews, eg date pickers, pagination, infinite scroll etc without any libraries

[@cosdensolutions]

Yes that's the plan ☺️

[@jordan_w]

Just found your channel and liking what I see so far! Loved watching along to see how you tackled the problem! My only suggestion for future videos would be to more clearly define the challenge at the start of the video; maybe by showing a mock up or your final product, so those of us who want to try the challenge before watching have something more clear to aim for without skipping through the video - This could also be good for viewer retention as it makes people want to see how you made it :)

[@cosdensolutions]

Yes that's a great tip, thanks a lot! Will try this in the next one and compare

[@kjbassu]

Yes we need React challenges🎉

[@kostiantynsydorenko7344]

Super video, thanks!

[@faizanahmed9304]

Thanks!

[@jimsmart2522]

Minor point re big-O... You keep saying O(2), but n-by-m is better described as O(n^2) - technically O(2) is still linear, but O(n^2) is quadratic. HTH Great content, keep up the good work!

[@cosdensolutions]

Yeah, I always mess these up lol. Thanks for the clarification!

[@saqibmuhammad7218]

❤ Love to see want more challenge videos

[@MuhammadIlyas-dr7eg]

I'm an experience backend dev and now moving toward full stack. We need a clone series as a project base learning

[@rebeldes96]

Great video, thanks a lot! and subscribed!!

[@w1kk857]

14:00 from react docs: "Keys must be unique among siblings. However, it’s okay to use the same keys for JSX nodes in different arrays." so, its perfectly fine to have keys [0, 1, 2...] in first array and the same in the second. They wont overlap.

[@cosdensolutions]

But here it was siblings though

[@jyotirmoykarmakar8511]

Hi! What's your VS Code theme? I really like it

[@vengateshvaidyanathang550]

Really Nice .. It will be too cool if we have series of creating a particular components of great product apps like Google apps, Microsoft 365, Apple

[@cosdensolutions]

Interesting

[@juliusngwu]

Awesome

[@ivanmosful]

Has ayone figured out how to span an event on multiple columns, or hos to break it if for example it starts at the end of the week and then continues on the next one?? Thanks in advance. Thanks for the video:)

[@0xtz_]

in the company I'm in we just did a weekly ssr calendar hhh it was a bit challenging with the query params holding the start week the filters etc and supabase and it was fun and I would like u to make a video to see how u structure it and build it in Next.js can you ? hmm 🤔

[@harag9]

Nice work, just shows how useful 3rd party packages are like the date one you used. Question on KEYs when mapping, I know it's best to not use index, and also they have to be unique. Can you confirm if they have to be unique throughout the page, if you had 3 maps, with index 1-100, should they all be different, you seem to be pointing at that with the "empty-index" you used. Would love to see more of these vids, but one suggestion I have is when you have a bug your trying to fix, please don't cut it out and then just show the end code.

[@cosdensolutions]

Keys have to be unique in the same parent, otherwise it's fine! That's why I added "empty-" there. And yes, I'm trying to find a balance between keeping the videos shorter and to the point, and explaining things thoroughly. Working on it!

[@nithinraj342]

Can u do lighthouse optimisation, I didn't understand plz do it

[@icoderdev]

❤

[@ShivamJha00]

What's a time complexity of O2?

[@nallaparajuamareshvarma8471]

can you please do day calendar challenge it would be more interesting

[@sriharansaravanan4653]

Please update more vedio .

[@activeuser_at]

Zoʻr

[@activeuser_at]

Ajoyib