Это видео недоступно.
Сожалеем об этом.

Nx Quickstart - How to Scale a JavaScript Project

Поделиться
HTML-код
  • Опубликовано: 14 авг 2024
  • Use Nx to power up ⚡🐋 full-stack JavaScript projects with modern tooling, automation, and sophisticated code-sharing for monorepos nx.dev/
    Nx is an open-source project from Nrwl 🦄🌊 nrwl.io
    Watch more free videos at fireship.io
    #nrwl #nx #javascript

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

  • @MikeBrits14
    @MikeBrits14 5 лет назад +544

    I went to an interview at a huge company yesterday for an Engineering lead role. After watching this video, I decided to bring up the topic of monorepos, and to see if they used them and how. They explained what they used, and the issues they faced. I told them about Nx and how it visualised dependencies, and they were really interested. That might have just landed me the job. I would not have known about it, or cared to click on this video if your content wasn't so pointed, clean and informative. Thanks for being great and for keeping the community up to date. You rock man.

    • @HuyNguyen-kd5vz
      @HuyNguyen-kd5vz 5 лет назад +23

      just curious, did you get the job?

    • @MikeBrits14
      @MikeBrits14 5 лет назад +125

      @@HuyNguyen-kd5vz I did actually! I now work as a team lead for them. Thanks for asking!

    • @Fireship
      @Fireship  5 лет назад +74

      Wow, awesome! Congrats mike!

    • @Oswee
      @Oswee 3 года назад +14

      Did you advised a tool for a huge company just by watching 10min video and they immediately hired you as tech lead?

    • @kibukamusoke
      @kibukamusoke 3 года назад +76

      @@Oswee from years of experience, 10 minutes will connect 5 years of dots if you know what you are listening to. That 10 minutes for Mike might be equivalent to 10 years for someone else. because he already knows what he is doing, Jeff is just helping him connect the dots. Jeff's content is not really for beginners, I hope people who come on here understand that.

  • @dallastjames
    @dallastjames 5 лет назад +15

    Awesome! I love NX. I've been using it for over a year now with Angular (recently transitioned to using nestjs as well) and it has been one of the greatest improvements to code maintainability and stability. Sharing code like interfaces and enums saves so much time and the ability to only test and build what has actually changed makes CI/CD quick and also helps know when you are making changes to an application that you may not have ever otherwise been aware of.

  • @troythompson2
    @troythompson2 5 лет назад +13

    Develop like Google... NX looks like a winner. Can't wait to try!

  • @RajSharma-tf9lv
    @RajSharma-tf9lv 3 года назад +5

    Man respect for you. I've watched many videos of you and I've to say that "Guys like you really pushes everyone on the platform to bring out better content and setting bar high for knowledge sharing" , which benefits us so thank you I'll take the subscription as soon as I get my first pay from my web development work.

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

      piece of docs was put to voice. the dullest video ever.

  • @shubhamjaiswal3029
    @shubhamjaiswal3029 5 лет назад +7

    Your Video Production Quality Is Best In The Industry!!
    Great Content ,Kudos Bro!! 🤟👍⚡😎

  • @alexisdvt
    @alexisdvt 5 лет назад +5

    OMG!! This is exactly what our team needs , thanks for sharing!!

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

    Just started as an lead engineer at a new company. We will rewrite our product and I've been looking for a tool to do so. Just found about NX and so far looks like a way to go! Thanks

    • @user-qs5dw9gw2t
      @user-qs5dw9gw2t 2 года назад +1

      Do you think that yarn berry workspace and Nx will be a good pair to manage monorepo?

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

      @@user-qs5dw9gw2t Never worked with yarn workspace but looking at Yarn Plug and Play feature that never ever worked correctly for me profesionally, I would say I woudln't do that personally. What we ended up doing is NX core repo at base, then add Nx plugins for nest and react- ( with CRA ), and for orchestreiting rest of the stuff we need ( like docker-compose etc ) we use simple Makefile.

  • @nachobroski
    @nachobroski 5 лет назад +22

    This is really interesting! I would want to see how you could create a fully automated CI/CD pipeline using monorepo methodologies like NX. Doesn't seem like many platforms support this very well at the moment.

    • @bovfbovf
      @bovfbovf 9 месяцев назад +1

      4 years later
      its shit

    • @farantaimoorbutt5028
      @farantaimoorbutt5028 8 месяцев назад +1

      ​@@bovfbovfhow can you explain i am learning it right now

  • @lucasrgsilva
    @lucasrgsilva 5 лет назад +24

    My brain almost blew up watching it

    • @Fireship
      @Fireship  5 лет назад +6

      Mission accomplished 💥

  • @ProgramWithErik
    @ProgramWithErik 5 лет назад +19

    Great tutorial, my team just moved one of our two Angular apps to nx. I was a little skeptical at first ( I wasn’t sure the added complexity was worth the time) , but now I can see that it’s not that bad, and sharing interfaces will be helpful. I’ll have to get the other ported over soon. FYI, was this sponsored by Nrwl?

    • @Fireship
      @Fireship  5 лет назад +8

      Nice! Not sponsored, but I was able to collaborate with them directly and get feedback before releasing it.

    • @matthewmullin2626
      @matthewmullin2626 5 лет назад

      How was the transition? Was there quite a bit you had to change? Think I'm in a similar boat to you and also debating wether its worth using from the start, or only worth adding once I see a need for it?

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

    I'm still a beginner trying to hang on and bearly scratching the surface of Web Development, but I can tell your content is gonna help a lot in a few months from now. Thank you for sharing this kind of valuable information.

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

      I dont think nx has positive when your team is 20+ if not it just seem like overhead

  • @Jared-Christensen
    @Jared-Christensen 5 лет назад +2

    We use NX at work, it has been great. Makes sharing code between teams so simple.

  • @mateja176
    @mateja176 5 лет назад +3

    Lerna and yarn workspaces are awesome too but the UI, especially the dependency graph, of Nx is outstanding 🦄🚀

    • @Fireship
      @Fireship  5 лет назад +3

      Totally, the VS code plugin is amazing. Not to mention all the code generating schematics.

    • @maazm4722
      @maazm4722 4 года назад

      @@Fireship unfortunately there is no support for jetbrains IDE ...

  • @LiorCHAMLA
    @LiorCHAMLA 5 лет назад +1

    Bro, your video editing is incredible, everything is so beautiful ! keep going !

  • @CarlosLopesAmaral
    @CarlosLopesAmaral 5 лет назад +2

    Love you bro. You've sold me the monorepo concept by using this tool and by explaining. I've seen the monorepo concept being wrongly used and in my case, it made the development process super slow and tedious.

  • @FilledStacks
    @FilledStacks 5 лет назад +7

    This is so cool. Very informative. Thanks for sharing this I had no idea about this tool.

    • @uziboozy4540
      @uziboozy4540 5 лет назад

      Nx is the best tool I've ever used in years. Top notch Nest, Cypress and Jest support.

  • @chrisanderson687
    @chrisanderson687 4 года назад +1

    I've been playing with Nx for a Nest/Angular app the last few days and it is so awesome! You guys have to try it out.

  • @eddiejaoude
    @eddiejaoude 5 лет назад +2

    Really nice 👍. I use mono repo as well as multi repo, but I wasn’t aware of this tool. Thanks for sharing 🤓

  • @ErmandDurro
    @ErmandDurro 5 лет назад +1

    Really loved the video. I had no idea that NX existed. Thanks a lot 😃

  • @dejson420
    @dejson420 5 лет назад

    OMG i went to your channel to look at how angular looks because I thought about using it in my new project and I found this awesome tool thanks.

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

    Doing research about monorepos and this is a superb video, thanks so much!

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

    The best CS channel on the RUclips

  • @RagoDN2
    @RagoDN2 5 лет назад +3

    Really hard to pick between React, Vue, and Angular when they all have amazing tools. Nx will likely put me back on Angular for my next app.

    • @RagoDN2
      @RagoDN2 5 лет назад +1

      @@user-if1de8pt2j Well, when I get a job, and if they have a preference, then I'll use what they want. Until then, all my projects are self-started and self-funded :P

  • @firaskudsy
    @firaskudsy 5 лет назад +2

    Thanks for the most amazing contents 🙏

    • @Fireship
      @Fireship  5 лет назад

      You you Firas 👍

  • @boradmay
    @boradmay 5 лет назад

    Geez man, the animation and design just get better.

  • @aaronaaronaaron5922
    @aaronaaronaaron5922 5 лет назад

    You are really incresing the level of the web! Thnaks man 🔥

  • @DondishGIL
    @DondishGIL 5 лет назад +1

    Pretty cool but I think Bazel is more important since it's actually build by Google

  • @wespal7782
    @wespal7782 5 лет назад +2

    Is it possible to include firebase cloud functions on a Nx monorepo? Please make a tutorial on this thanks.

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

    I Love It When The Notification Comes, "Someone Has Subscribed Your Channel" 🙂 It Alw‌ays Makes‌ My Day!...

  • @MaxPicAxe
    @MaxPicAxe 5 лет назад +2

    Very interesting. By the looks of things this is specific to typescript/javascript, and seems to depend heavily on node.js + its own building tools, so I'm guessing there's not much flexibility. But I'll have to look at it :)

    • @vincent-thomas
      @vincent-thomas 2 года назад

      It also supports go and rust through plugins. And you can make your own plugins too for your desired language

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

    Very well explained as always, thank you!

  • @harpymaslow
    @harpymaslow 5 лет назад +2

    Thanks Jeff! Really interesting. I'm not sure what I would gain by using it though. My current project has multi-apps Angular (/projects folder) + Firebase (functions/ folder) + Types and models (shared/ folder). I'm sharing code between the Firebase cloud functions (Express) and the Angular apps without any issue. Why should I use NX ? Is it only useful if I want to add some React, Vue, Svelte apps too ?

    • @harpymaslow
      @harpymaslow 5 лет назад

      So should I try NX in our opinion ? In a near future I should have like 6 angular apps in this repo. Will each app slow the build a little more ? Also I'm using Cypress already and I love Jest. Maybe NX would be the way to go. What do you think ?

    • @Jared-Christensen
      @Jared-Christensen 5 лет назад +1

      ​@@harpymaslow With your current setup if you made a change in one of your shared types you would have to remember to build both of your apps. This will become more complicated as you add more apps and more shared libs. NX will track all of the changes for you and only build the apps that need to pick up the changes from the shared libs. NX becomes very handy when you start to automate your deployment. For example, we have a build pipeline that watches for changes in our mono repo. When we make a change in a shared lib it will figure out what apps use that lib and only build, test and deploy the apps that are affected by the change in the lib. This will speed up your deployment as you don't have to build everything every time you make a change.

  • @roland0012
    @roland0012 5 лет назад +1

    Pretty cool, but I would love to see how we can integrate Ionic and/or NativeScript as well to the stack! Great video anyways! :)

    • @Fireship
      @Fireship  5 лет назад

      That is very possible, I've seen people use both NativeScript and Ionic with Nx. For example nstudio.io/xplat

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

    To all new viewers. This video will just end up confusing you if you were to follow it step-by-step, so I wouldn't recommend wasting your time doing that. Visit the dev site in the description to learn the latest version of NX instead.

  • @JFkingW
    @JFkingW 5 лет назад +1

    Does it make sense to have apps different languages in a monorepo? Like a flutter app and a js app?

  •  5 лет назад +2

    How to setup Nx monorepo with Vue project (while there's no official support) would be much appreciated!

  • @trophieboi1820
    @trophieboi1820 5 лет назад +4

    Whoa that was fast.

  • @ak-loz
    @ak-loz 5 лет назад

    Nice spider man-like, web animation :)

  • @mnlttt
    @mnlttt 5 лет назад +1

    Right when I started using Nx workspaces! How would you set-up SSR with Nx, Angular and Nest? I'm stuck at an error about webpack that isn't able to find the entry point, using the NestJS's universal module

    • @Fireship
      @Fireship  5 лет назад

      Hmm, I'm not sure personally but sounds like a good GitHub issue, that would be very useful to have documented.

  • @CPEJammy
    @CPEJammy 5 лет назад

    Amazing contents. Thank you !

  •  5 лет назад

    I would love a video about managing monorepos from the GitLab perspective as well.

  • @TheCopymark
    @TheCopymark 5 лет назад +1

    Would you put your Java Spring Boot (Maven) Backend in the "apps" folder aswell?

  • @rakeshroy7986
    @rakeshroy7986 5 лет назад

    This is cool. Please start a series on nestjs

  • @tiedye001
    @tiedye001 5 лет назад +2

    Looking forward to support for firebase in nx.

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

    Love it !

  • @kingjulien1921
    @kingjulien1921 5 лет назад

    this was so helpful, really

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

    Is kubernetes even needed anymore then for scaling?

  • @davidevalenti1172
    @davidevalenti1172 5 лет назад

    Hi what themes are you using for typescript/JavaScript in your angular examples? Btw thanks for teaching me almost everything i know about angular/firebase

  • @tranquillityEnthusiast
    @tranquillityEnthusiast 5 лет назад +2

    Plz make a vedio on nestjs sir...

    • @Fireship
      @Fireship  5 лет назад

      Will do!

    • @tranquillityEnthusiast
      @tranquillityEnthusiast 5 лет назад

      @@Fireship plz do combine with angular and try to deploy nestjs app to cloud function...

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

    where can i find the depency diagram in the intelliJ nx console?

  • @Noah-vm8id
    @Noah-vm8id 2 года назад

    Should I also put my react native repo in there? Since it doesn‘t run on the server later

  • @ak-loz
    @ak-loz 5 лет назад

    Throughout this whole video I kept wondering-- What are the best practices for Angular and JS?
    I've gone through the stuff on Free Code Camp and MDN, but I don't feel my stuff is optimized.

  • @MYMPSWORLD
    @MYMPSWORLD 5 лет назад

    Great Video! 👏👏
    The reason most big orgs still uses monorepos are - easy to set up(less configuration needed), easy access management(take days sometimes to get access to a single repo) and unwillingness to adopt.
    Monorepos has its benefits as you stated(sharing interfaces and common utilities is a huge bonus) but comes with huge drawbacks too. 😢
    Can you make a video for sharing code (eg. API interfaces and mocks) through libraries/npm dependencies? I never tried it personally but seems like a pretty useful project. You can use an API management tool like swagger too as an additional bonus.

  • @huantao2274
    @huantao2274 4 года назад

    having issue share data object ( as a lib used between nestjs and frontend app), since nestjs use class as data object, In frontend typescript, data object is simply interface

  • @yoshiinatuki
    @yoshiinatuki 5 лет назад

    How do you add the plugin to activity bar, mine is not showing up, not a VSCode user, tried to google but without success.

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

    what about very complex dependency version conflicts ?

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

    I have no idea whats happening, stuff is just flashing around on the screen randomly. This should have been scrapped and re-recorded with the cursor visible.

  • @shafeequemattummal6772
    @shafeequemattummal6772 5 лет назад

    Could you please mention the theme, icon theme and font you are using in VS Code? Thanks

  • @ducnguyen123
    @ducnguyen123 3 года назад

    could you share the link of the project ? I want to move backend project to backend folder, but nx just keep create new backend folder inside apps folder

  • @akhilk5121
    @akhilk5121 3 года назад +1

    Doesn't this make git commit history useless?

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

    Is it recommended to setup git submodules per app?

  • @will_abule
    @will_abule 5 лет назад +1

    Awesome 👍 I love you men

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

    How do you deploy once you have all of these apps created without deploying everything on a single commit?

  • @nemanjasubotin5465
    @nemanjasubotin5465 5 лет назад

    Great video! ^_^ I also have 1 question, if i were about to migrate my spring boot hibernate and angular project into nest.js sequelize-typescript. How and where could i deploy that? I mean i know about firebase hosting but it requires firebase as the backend service... Like... I would like to have some kind of remote server literal desktop server where i could connect and manage my deployed applications. Please help

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

    How is the different from turborepo ??

  • @chrisclarke7937
    @chrisclarke7937 5 лет назад +2

    I feel like I've just received an upgrade.

  • @just0for0adult
    @just0for0adult 5 лет назад

    How about monorepo for different languages

  • @valentinopereira58
    @valentinopereira58 5 лет назад

    Thanks bro

  • @hemanthkumar8330
    @hemanthkumar8330 5 лет назад +3

    #first

  • @keramaswiguna9434
    @keramaswiguna9434 5 лет назад

    😍😍😍

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

    Anyone here have experience using this? If yes, what are your thoughts on it (so far)?

  • @justfly1984
    @justfly1984 5 лет назад

    tslint is deprecated, use eslint instead

  • @vinceramcesoliveros6739
    @vinceramcesoliveros6739 5 лет назад

    Even their illustrations are open source... neat, but they need to change it afterwards

  • @911madza
    @911madza 5 лет назад +3

    let question = "should you sub this channel?", answer
    if(0.1+0.2==0.3){answer = 'hell no'} else {answer = 'oh yes'}
    console.log(answer)

    • @Zhuclam
      @Zhuclam 5 лет назад

      Output: 0.3000000001, false xD

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

    still dont know how to start the app after watching

  • @Gstyle85255
    @Gstyle85255 5 лет назад

    holy shit

  • @skipmonday6467
    @skipmonday6467 5 лет назад +1

    My brain hurts

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

    Reading Nx's documentation is more captivating than watching this dull video.

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

    :)

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

    Would IDE expode?

  • @rimay4392
    @rimay4392 5 лет назад

    hihi

  • @NightsArrowz
    @NightsArrowz 5 лет назад

    Brain = blown

  • @RageBasterd
    @RageBasterd 5 лет назад

    Super cool, but I hope I never need it

  • @anikethsaha5064
    @anikethsaha5064 5 лет назад

    That is too much help for a developer.....
    Not required maybe

  • @user-ip7xm5tb1c
    @user-ip7xm5tb1c 2 года назад

    Too fast...