I Found the Perfect Open Source React Project (Code Review)

Поделиться
HTML-код
  • Опубликовано: 7 апр 2024
  • 🚀 Project React → cosden.solutions/project-react
    Repo → github.com/nodejs/nodejs.org
    Join The Discord! → discord.cosden.solutions
    VSCode Theme | Font → Material Theme Darker | Menlo, Monaco "monospace"
    In this video we will review the perfect open source React project. This project has all of the best practices and design patterns implemented, and is a phenomenal model to use for your own applications. We will learn about scalable architecture, clean code and components, and how to build a project that can handle hundreds of developers working on it at the same time. This literally is the perfect open source React project!

Комментарии • 43

  • @YancyGarretSaac
    @YancyGarretSaac 2 месяца назад +11

    Thank you for this video! I was requesting this kind of content on discord a month ago 😊

  • @ShailendraSingh-cd2ln
    @ShailendraSingh-cd2ln 2 месяца назад +6

    As always your videos are really good.

  • @chadrackkyungu2167
    @chadrackkyungu2167 2 месяца назад +1

    Wow thank you for the video, I have been looking to learn how to structure the application to a point where it can scale , again thank you so much love it

  • @nemeziz_prime
    @nemeziz_prime 2 месяца назад

    This is so cool! I really like how you teach the best practices for React using live real-world examples to explain how to organize code and write good code. I believe writing code is one thing, but organizing code is as important as writing code. Maintainibility ftw xD Once again thanks a lot!

  • @JesseStrangfeld
    @JesseStrangfeld 2 месяца назад +2

    The reason for the higher-order components is to be able to use them directly in the MDX files. By embedding React components into the Markdown, authors can dynamically add or remove components from the page rendering without having to change any coding.

  • @yusuf9633
    @yusuf9633 2 месяца назад +2

    Amazing boss thanks for this

  • @ceb418_yashnitinkamble6
    @ceb418_yashnitinkamble6 2 месяца назад +3

    Thankyou Cosden for this amazing opensource repo.... we'll definitely start to contribute to this repo and also gather best approaches from it

    • @afzalhamdulay
      @afzalhamdulay 2 месяца назад

      At first i thought why grim is commenting here😂

    • @DoerNation
      @DoerNation 2 месяца назад

      ​@@afzalhamdulay😂

  • @powerrampage
    @powerrampage 2 месяца назад +1

    Great video content.

  • @WilliamShrek
    @WilliamShrek 2 месяца назад

    Awesome!!!!🥳

  • @imkir4n
    @imkir4n 2 месяца назад +1

    Thanks man.

  • @akashthoriya
    @akashthoriya 2 месяца назад +1

    Suggest more such projects, because it's hard to find good open-source react projects

  • @curiouslycory
    @curiouslycory 2 месяца назад +23

    They did so many great things but the lack of "src" directory makes me so uncomfortable. I wonder if there's a discussion somewhere that explains the thinking because that would be amazing.
    Mixing camel case and kabab case for files is also unnecessary clutter. Why would you want contributors to have to decide which to use each time?

    • @lebronjaimeslannister
      @lebronjaimeslannister 2 месяца назад +4

      +1 on this

    • @mrbutish
      @mrbutish 2 месяца назад +3

      Because every single folder added is a potential ../path/ for imports, also you can only manage your own files case, on a big project it is inevitable someone will mix camel case and hyphens in their functions, variable names, file names, metadata configuration while working between python and JavaScript and Java naming conventions

    • @curiouslycory
      @curiouslycory 2 месяца назад +4

      @@mrbutish You can add a linting rule that prevents mixed case. Define once, no longer inevitable. Clean code and project structures allow us to more quickly find files, read code, and spot problems thanks to the way the human brain does pattern matching. It also helps avoid decision fatigue by making file and variable naming a smidgen easier.

    • @rand0mtv660
      @rand0mtv660 2 месяца назад

      @@curiouslycory yeah setting it up as a lint rule just also lets reviewers focus on other important things and not kebab vs camel case conventions during reviews. Let linters do this boring work that's prone to errors and easy to overlook, but hard and tedious to enforce manually.

    • @viperactual
      @viperactual 2 месяца назад

      You can still use a "src" directory.

  • @guddisAlex
    @guddisAlex Месяц назад

    I looked into the code and really liked all the stuff they put in and how they structured their project... really clean! One thing I dont know about is having all components in index files, isnt it hard to search for files or not?! Another thing i dont know about is to use const and FC do define components?! Why not just a normal function? The overuse of arrow function in const i dont like generally... I tend to use const only if I really need it. Having your functions in actual functions it does not matter where you have it in your component, but nowadays everything has to be in a const var, which originally was meant to define constants ;) And I dont even think they used the pages folde ras the pages router, I think they just used the folder to organize their markdown files or no?!

  • @pryff9569
    @pryff9569 2 месяца назад +2

    What do you think about the WSD architecture in large React projects?

  • @faez322
    @faez322 2 месяца назад +5

    Like your PERSIAN tattoo bro!😍

    • @Govind_rana500
      @Govind_rana500 2 месяца назад

      That's Arabic script

    • @faez322
      @faez322 2 месяца назад

      @@Govind_rana500 Thats PERSIAN. google it.
      این نیز بگذرد

    • @codealireza
      @codealireza 2 месяца назад

      @@Govind_rana500 arabic and persian using the same script almost but totally different languages and his tattoo is in persian language which says "this too shall pass"

  • @stvn-light
    @stvn-light 2 месяца назад +2

    How do you make your videos so smooth? What are you recording this video with?

  • @jaspervandenbroucke1277
    @jaspervandenbroucke1277 2 месяца назад

    Hey, what are some problems in web/software development that companies/developers can face these days? I ask this because I have to do some research on a specific problem in IT.

  • @mani_naik
    @mani_naik 2 месяца назад +3

    Is there some open source react project with redux ?

  • @kizigamer6895
    @kizigamer6895 2 месяца назад +2

    My doubt why use nextjs for this and not use Astro for it which will have better md support

  • @_bestbeast
    @_bestbeast 2 месяца назад

    Please make a video on phone authentication in nextjs

  • @imok5746
    @imok5746 2 месяца назад

    What level in react should watch this?

  • @meowWeee
    @meowWeee Месяц назад

    can you share your react course in other platforms like codedamn, udemy some other

  • @PaweSmoka
    @PaweSmoka 2 месяца назад

    It is not bad, nicely configured and a lot of ready to use solutions, yet it is far from being perfect (for example issues: default exports, no community based dir patterns, could use signals instead of hooks etc, global styles /a lot of it/, too generic naming / hooks, util /, no module based split so types are global etc. etc.. )

  • @Jay-pj7ob
    @Jay-pj7ob 2 месяца назад

    Please change the file icons theme to material icons, if possible

  • @Amirthanand
    @Amirthanand 2 месяца назад

    Whats a "__foldername__" convention for ?

  • @m12652
    @m12652 2 месяца назад

    This project won't run for me, just get a bunch of module not found errors all pointing to shiki/langs/...
    Also... it uses a whole bunch of google api's and fonts, not good practice for production from my perspective.
    Would be interested to see something similar for sveltekit 👍

  • @edhahaz
    @edhahaz 2 месяца назад

    Not overkill, beyond overkill

  • @brooklyn6683
    @brooklyn6683 2 месяца назад +1

    ❤😅

  • @dhananjaym9148
    @dhananjaym9148 2 месяца назад

    man give me coupon code for project react ❤

  • @imornar
    @imornar 2 месяца назад +4

    I lost you at hoc usage, thanks, i'll pass