From Junior To Senior React Developer - Best Practices

Поделиться
HTML-код
  • Опубликовано: 24 ноя 2024

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

  • @CoderOne
    @CoderOne  2 года назад +4

    Everyone looking for the theme I'm using, it's called Halcyon.
    I have a full video explaining my custom theme setup too
    ruclips.net/video/GLqx_yRi-iA/видео.html

  • @HeinekenLasse
    @HeinekenLasse 2 года назад +164

    As a senior dev I would like these 13 mins of my life back

    • @EDS432
      @EDS432 2 года назад +2

      u arent ;ü

    • @sergey53689
      @sergey53689 2 года назад

      You are very patient:)

    • @kantyDarius
      @kantyDarius 2 года назад +19

      If u r a senior dev what the heck r u doing watching this!?

    • @danielkeefer1901
      @danielkeefer1901 2 года назад

      I'm not even a senior yet and i would still like these 4 minutes clicking on the time stamps back

    • @SIGMA_BLYAT
      @SIGMA_BLYAT 2 года назад +1

      why u prefix interface with I? it makes no sense, final object is object

  • @goldfishbrainjohn2462
    @goldfishbrainjohn2462 2 года назад +53

    According to the skill sets, I was senior dev already since the first day of my first dev job.

  • @saeedhalabi
    @saeedhalabi 6 месяцев назад

    As a junior developer, this video was incredibly helpful.
    You just earned yourself a new subscriber!

  • @RusuTraianCristian
    @RusuTraianCristian 11 месяцев назад +7

    The thing you're calling camelcase in your code is actually pascal case.
    camelCase
    PascalCase
    in React, function components should be PascalCase and anything else camelCase.

  • @EduardoCLJ
    @EduardoCLJ 5 месяцев назад

    Great video! Thanks for taking your time to produce it!

  • @rasulkhujaganiev5082
    @rasulkhujaganiev5082 2 года назад +30

    instead of using moment js I'll recommend to use dayjs or date-fns

    • @JustinMylo
      @JustinMylo 2 года назад +1

      Good one, i would add using Luxon as they're from the Moment.js maintainers themselves

    • @elijahcannon2863
      @elijahcannon2863 2 года назад

      I also recommend dayjs

  • @VictorMartins239
    @VictorMartins239 2 года назад +6

    based on that roadmap i'm a senior dev, earning as a junior

    • @wilvermanuel7447
      @wilvermanuel7447 2 года назад +1

      Me too

    • @BillClinton228
      @BillClinton228 5 месяцев назад +1

      I got a 100% increase on my salary by leaving a company that didn't appreciate my skill and experience... don't hang around places where you are not compensated fairly.

  • @QueeeeenZ
    @QueeeeenZ 2 года назад +73

    You dont jump from junior to senior, there are also mid-level developers.

    • @internetexplorer7880
      @internetexplorer7880 2 года назад +5

      🤓

    • @johnklimes4402
      @johnklimes4402 2 года назад +1

      @@internetexplorer7880 XDXD insane comm with this nickname :D:D:D:D

    • @dputra
      @dputra 2 года назад +2

      And here I am, a mediocre dev

    • @BillClinton228
      @BillClinton228 5 месяцев назад

      No matter how many years of experience you have... a senior dev is whatever your boss decides it is. Oh you're not familiar with this JS library that was release last week... junior. Oh you've worked here a month and you dont understand every detail of this application that took us 10 years to build? Junior.

  • @SimeonIeroteev
    @SimeonIeroteev Год назад +2

    I'm highly recommending Tao of React from Alex Kondov! The book has many, many tips & tricks and awesome stuff, which will be very useful in the real projects, but the book is not for junior developer. In my opinion, you should have at least 2 years as a React developer!

  • @Joshuaomorales
    @Joshuaomorales Год назад +1

    Correction at 9:20. It's PascalCase not camelCase.

  • @arcosd63
    @arcosd63 Год назад

    Man, this information is gold. Thank you. David from NYC.

  • @bobdpa
    @bobdpa Год назад

    Thanks! 💯

  • @Alex.Shalda
    @Alex.Shalda 7 месяцев назад

    thanks for the vid!

  • @JoAcOx7
    @JoAcOx7 2 года назад

    amazing, thank you!

  • @alr969
    @alr969 2 года назад

    Thank you. Very helpful🙌

  • @djameleddine3303
    @djameleddine3303 2 года назад

    well... that was very helpful to me thanks 🙏

  • @Randomuser21265
    @Randomuser21265 2 года назад

    Thank you so much

  • @dimahalaiskiy7491
    @dimahalaiskiy7491 Год назад

    I knew that all stuff before this video, so I gues I am a senior now😅

  • @EpicTheoryChannel
    @EpicTheoryChannel Год назад

    ohh thanks

  • @LunarCosmic
    @LunarCosmic Год назад

    Amazing

  • @DuyTran-ss4lu
    @DuyTran-ss4lu 2 года назад +1

    This video is a gem

  • @mayurpatel6657
    @mayurpatel6657 2 года назад +7

    it would be very nice if you provide us the Figma link of all the charts and points.

    • @CoderOne
      @CoderOne  2 года назад +5

      Linked added to the description. Thanks for the letting me know!

  • @srinivasa.meesala
    @srinivasa.meesala 2 года назад

    Almost fell asleep wNice tutorialle listening to Nice tutorials voice

  • @jaroslavhuss7813
    @jaroslavhuss7813 Год назад

    9:40 - Rust developers hugely disagree... It's a matter of a preference and I prefer the snake case :-)

  • @NoOne-gm3lf
    @NoOne-gm3lf 2 года назад

    Love from algeria

  • @speedps235
    @speedps235 11 месяцев назад

    Hi, I agree with that we should avoid class components (at 4:48) and in 99% of use cases we use function components, but... When we have very complex logic and we have a huge project when we want to introduce some kind of abstraction that handle specific logic and we want other developers to just extend given case and make a concrete implementation can we use for this Class component? Or should class components be never used?

  • @masterdr1
    @masterdr1 Год назад

    dont forget SNAKE_CASE is used in defining global Constant in JS world

  • @erickmoya1401
    @erickmoya1401 2 года назад +9

    First thing to know, you are either a Senior Software Developer or you are not, there is no "Senior in React", or "Senior in X but Junior in Y". Seniority is something you carry no matter the language, framework, meta-framework or IDE.

    • @henriqueb5637
      @henriqueb5637 Год назад

      I don't get it.
      Lets say I am a senior developer with 7 years of experience working with Javascript and now I want to switch to something else like PHP or C++.
      I would switch to a senior position already?

    • @henriqueb5637
      @henriqueb5637 Год назад

      I get it now!
      "Seniority" is just some bs label a company puts on you. It means nothing.

    • @lord-of-the-shinobi-world
      @lord-of-the-shinobi-world Год назад

      @@henriqueb5637
      Junior or Senior dev does not have much differences.
      The reason is, employers always LIE in their job description. This is not something new.
      They post jobs that say "Need a Junior Developer", but then they ask for a person to do basically....everything, including ... Design, and they call it "Junior Developer".
      Other than the title, Junior and Senior devs have no difference. Companies just use the titles to either pay you less, or to pay you more(sort of. But paying you less is 100% certain).

  • @joewalker681
    @joewalker681 2 года назад

    never thought i'd see typescript and camel case in the same video but here we are

    • @jonasgrnbek7113
      @jonasgrnbek7113 2 года назад +3

      Do you not use camel case when using typescript?

  • @pikavecordis5056
    @pikavecordis5056 2 года назад +2

    This is more of a tutorial "From Beginner to Beginner-Junior React Developer"

  • @ESArnau
    @ESArnau 2 года назад +4

    All respect but I think all these points are very basic. Maybe better practices like:
    - clsx to reduce readability complexity when using ternary operators on classNames
    - using children as Props when creating components instead of too many props...
    - having super clear how some hooks from 3rd party libs like jotai or recoil can trigger unnecessary re-renders
    anyway good vid

    • @Bobby-op6ip
      @Bobby-op6ip 2 года назад

      clsx is trash, stop installing packages and do things from scratch if you want to be a senior

    • @alexcoroza4518
      @alexcoroza4518 Год назад +1

      @@Bobby-op6ipdoing all from scratch does not make you a senior, but yeah it will make you a good developer. In business perspective, we dont want to "reinvent the wheel" working on functionalities that are already available and ready to be used. Making your own from scratch will most likely lead you to bugs. Fixing those bugs will take you more time which is really for the business side. Unlike when using an already-made and mature plugin wherein they already encountered those bugs and already fixed them. Creating from scratch is not always the smart choice

  • @batu4605
    @batu4605 2 года назад

    Can u share your vs code settings and ui theme please 🙂

  • @theprimecoder4981
    @theprimecoder4981 2 года назад

    I'm a beginner at typescript but I wanted to know when to use interface vs typed

    • @rea1m_
      @rea1m_ 2 года назад

      Just use interfaces

    • @peterharwa9472
      @peterharwa9472 2 года назад +1

      Check out Jack Herrington's channel on RUclips. He has a very good Typescript series.

    • @kylemckell
      @kylemckell 2 года назад +1

      Not much of a difference. They have very very slight differences. At the end of the day they're not that different. Interfaces are a bit faster on compile time, but types have a few things that interfaces do not (which I'm forgetting atm)
      Essentially, just choose one and call it a day

    • @daniiltkachuk7519
      @daniiltkachuk7519 Год назад

      the main difference is that interfaces can be extended, types not

  • @emreq9124
    @emreq9124 Год назад +1

    Btw, Typescript Team itself doesnt recommend to name your interfaces with prefix "I" like IUserProps or UserPropsInterface. It doesnt work like in c# or java.

    • @jaycobbs
      @jaycobbs Год назад

      but this is very helpful to store all types with I-prefix, then you can easily import them with intelisense without consternation

  • @BarberoPablo
    @BarberoPablo 2 года назад

    Hi, at 10:00 you talk about camelCase, the file0s name is "camel_case" (I know its just an example), the best practice would be to name it "camelCase", "CamelCase" or "Camelcase" ?
    Thank you, nice video

    • @JustSall
      @JustSall 2 года назад +2

      Hey! Camel case is: starting of every word is capitized. E.g, HelloWorld, CamelCase, camelCase, difference is for first letter of a constant/var it is small case and for bigger functions/components such as Jsx components we use Uppercase Camel Case ,

    • @BarberoPablo
      @BarberoPablo 2 года назад

      @@JustSall thank you very much!

    • @jaycobbs
      @jaycobbs Год назад +1

      @@BarberoPablo tbh they arent camel case. Valid naming is camelCase, PascalCase, snake_case, kebab-case :D

  • @ХайёмОдинаев-я7я
    @ХайёмОдинаев-я7я 2 года назад +1

    rename video to:
    from idiot to junior react developer

  • @palyanytsia
    @palyanytsia 2 года назад

    What is the name of this VSCode theme?

  • @SahraClayton
    @SahraClayton 2 года назад +1

    7:33, how does Typescript make your code easier to read. It makes your code look poluted and disgusting.

  • @Isaac-eh6uu
    @Isaac-eh6uu 2 года назад +1

    Isn't this video terribly inaccurate I haven't used react much but I adopted everything you talked about but really isn't much. Learning design patterns is also controversial so I don't really know what are going for here.
    I once used React-Bootstrap and wanted to get the input through refs but could only make it work with an class component. What do you do?

    • @masiafmasiaf2204
      @masiafmasiaf2204 2 года назад

      I would said learning design pattern is not that controversial, in any case u can reuse the same pattern in other language a win win, the thing that u want to get the input with a ref only work on class component, I myself have not come to that issues, I am so into fc that forgot almost class component, but in theory should work in both

  • @me_rinta
    @me_rinta 2 года назад +1

    Just link the last 2 resources man

  • @anandca4096
    @anandca4096 2 года назад

    I have been into web dev for 3 years now and I'm feeling a little bit unmotivated rn 😓

    • @burhaann
      @burhaann 2 года назад

      Take a break Mr. Chartered Accountant
      Don't overdo development

    • @CoderOne
      @CoderOne  2 года назад +6

      Take it easy on your self. We are all just beginners trying to always learn something new. Most of us are just a bunch of googlers 😃

    • @HeinekenLasse
      @HeinekenLasse 2 года назад

      If you feel unmotivated now wait until you fail every single FAANG interview you are able to arrange

  • @nonstopper
    @nonstopper 2 года назад +1

    Typescript is the exact opposite of making your code look "cleaner"

  • @harry4088
    @harry4088 2 года назад

    Hey Sir Can u Please tell me your vs code font name (settings--font-family)..i want to use this

  • @UnsentPH
    @UnsentPH 2 года назад

    when is enough to learn the js and next to ts?

    • @loogie5679
      @loogie5679 2 года назад +2

      Don’t use Typescript if you don’t need to
      JavaScript has been here for years and ain’t going anywhere

    • @primearchitech
      @primearchitech 2 года назад +1

      @@loogie5679 almost every professional project Is using TypeScript now. So it's worth learning it. And it's not difficult at all. I learned almost everything I needed for a React project in like 3 hours last year.

    • @bazanowsky
      @bazanowsky 2 года назад

      @@loogie5679 Dont use JavaScript if you dont have to. Typescript is there to write better code.

    • @loogie5679
      @loogie5679 2 года назад

      @@bazanowsky I am just saying that all the front end stuff change too much and too often for anyone to be able to follow. No matter the trends at the end of the day JavaScript will still be the reference language for web development. It does its job and have been doing it good since the beginning and that’s what companies are looking for. Something that can do the job. I know companies that are still working with JavaScript and they are doing great. That’s what I am saying, don’t follow the trends. Learn Typescript only if you really need to. Chances are you won’t need it since you can do very well with Javascript. So, learn Typescript if your company asks you to

  • @afin4684
    @afin4684 2 года назад

    Theme ayu?

  • @daniiltkachuk7519
    @daniiltkachuk7519 Год назад

    Camel case in video about how to go to a level of senior developer, really?

  • @anilgadwal1149
    @anilgadwal1149 8 месяцев назад

    Well then I guess I was a senior dev since my very job then lol

  • @joaohep52
    @joaohep52 2 года назад

    I came here just to know the theme, please somente tell me

  • @MrEnsiferum77
    @MrEnsiferum77 2 года назад

    There is everything, but not teamwork from senior. It does not analyze anything, just tell u, we need to do that. Programming experience nowadays is somehow weird, because everyone is today senior developer. Senior not helping at all, just the junior is thrown in the project for few and that he pickup tasks by himself.

  • @guled669
    @guled669 2 года назад

    Senior developer just means more headache

  • @Dam-zn1dd
    @Dam-zn1dd 2 года назад

    Analyzing user needs is UX Designers job.... not developer

  • @colorfulmus
    @colorfulmus 10 месяцев назад

    This is more like a zero to junior dev tbh

  • @ПожилойСкарабей
    @ПожилойСкарабей 2 года назад

    Dude I knew these things from day 1 course on udemy, am I a senior or like a skeleton-dead developer already?

  • @polcaltieri
    @polcaltieri 2 года назад +1

    A developer that implements a full function inside of an element is not a junior developer, it's just a bad developer

    • @elijahcannon2863
      @elijahcannon2863 2 года назад

      Or a lazy developer that doesn’t care about maintaining the code or working with teams. I know many typescript developers who choose not to use typescript for some projects and that’s ok.

    • @sergey53689
      @sergey53689 2 года назад

      ​@@elijahcannon2863 yes, the typescript is an additional shit around your code. I am coding on JavaScript about 5 years (and learn programming about about 21 years) and typescript is unnecessary thing. JavaScript is self-sufficient language without typescript

    • @sergey53689
      @sergey53689 2 года назад

      This is just a one variant of implementation. Programming is a space of variants

    • @jaycobbs
      @jaycobbs Год назад

      @@sergey53689 have you ever tried to maintain a bigger project with and without typescript? ofc with other programmers🙃

  • @AIArtistTunes
    @AIArtistTunes 2 года назад

    Burh you are a junior🤣

  • @RaZziaN1
    @RaZziaN1 2 года назад +9

    You don't need 80% of this crap as senior. Don't even listen to this guy.

    • @primearchitech
      @primearchitech 2 года назад +2

      Ok, so what do I need to be senior?

    • @SAMEDITING
      @SAMEDITING 2 года назад

      @@primearchitech You need to know what works in different situations, when and what to prioritize and good mentoring skills. Think about creating value, scalability and maintainability. The "best" code is not the perfect design pattern, rather the teams who deliver working production code on time, you can always refactor it later for maintainability.

  • @Pokemonman44441
    @Pokemonman44441 Год назад

    There is so much wrong with this video. I disagree with many things you talked about in this video. Your functions should be named snake case and should be used with function and not arrow functions and your variables should be cameCased. Arrow functions should only be used for small inline functions and react components.

  • @VladyslavAvidzba
    @VladyslavAvidzba Год назад

    Such a poor use of typescript in the video🤡 It is so weird to see the author talking about naming conventions meanwhile declaring interfaces with the 'I' prefix🤡 Also never write your TS code in the .d.ts files and never use interfaces to simply describe object shapes. Use interfaces only when you need the specific attributes of interfaces: implementation and cascading

  • @mladenstojkovic3402
    @mladenstojkovic3402 2 года назад

    This is utter garbage. No senior, let alone a junior should blindly follow these rules.

  • @2222ferry
    @2222ferry 3 месяца назад

    bullshit , what you say

  • @andrewwall2730
    @andrewwall2730 4 месяца назад

    I hate Typescript. For one thing it is an MS abomination of JS, and if you are an advanced JS developer you don't need it. It bloats the code, tries to make it Java-like. Leave JS alone, understand it is not a static typed language, which is it's core strength and just learn. It does not prevent runtime errors, just use proper guards and all will be well.

  • @Pareshbpatel
    @Pareshbpatel Год назад

    Very informative. Thanks.
    {2023-11-03}

  • @dilshodabdullayev6059
    @dilshodabdullayev6059 2 года назад

    )))))