What is Server-Side Rendering? (Server-side Rendering with JavaScript Frameworks)

แชร์
ฝัง
  • เผยแพร่เมื่อ 4 พ.ย. 2024

ความคิดเห็น • 123

  • @GreenIdo
    @GreenIdo 7 ปีที่แล้ว +7

    Great job David! As always, on the point and putting a smile on the viewers' faces.

  • @alfredoro2664
    @alfredoro2664 6 ปีที่แล้ว +10

    Best explanation about SSR that I found online. Thank you so much!!!
    From: a Front End Developer

  • @gabrielkwiecinskiantunes8950
    @gabrielkwiecinskiantunes8950 7 ปีที่แล้ว +1

    I feel like I never get to say how much I love these kids of videos.

  • @thesouthsidedev1812
    @thesouthsidedev1812 2 ปีที่แล้ว +2

    This was a really clear explanation of SSR

  • @Erraticfox
    @Erraticfox 7 ปีที่แล้ว +18

    You guys should make a tutorial on Authentication with a Social Media account with Node and Express. It's so confusing and I think it's a critical step to building a website / web app with a user database.

    • @bill18286
      @bill18286 7 ปีที่แล้ว

      ErraticFox which part are you struggling with? Perhaps I can help.

    • @Erraticfox
      @Erraticfox 7 ปีที่แล้ว

      Will if you have Discord which would be easier to message back and forth add me ErraticFox#1742 I'd really appreciate it. :)
      Right now I'm having an awful time making a route to authenticate a Facebook login and then storing it in the session. Though, I can't even make it past the route part as it keeps giving me a "location.protocol" error even though it's through the firebase serve command with hosting and functions. Thanks for the reply :)

    • @D2KX
      @D2KX 7 ปีที่แล้ว

      Well, this is the Firebase TH-cam channel, so obviously they'd like you to use Firebase for the Backend & Auth instead of doing it yourself with Node+Express. Which, btw., is totally what I would recommend, because it makes it real easy.

    • @Erraticfox
      @Erraticfox 7 ปีที่แล้ว

      Dennis Martin Herbers they even have a tutorial to set up a node + express app. Why would they not want you use Node + Express, but have a tutorial to set that up?

    • @leduyminh48
      @leduyminh48 7 ปีที่แล้ว +1

      Passport.js implements authentication perfectly for Node.js so you dont need to reinvent the wheel here.
      Various startegies for Social Media authentications are also supported. you can check it out here passportjs.org/docs

  • @wardenpataski2882
    @wardenpataski2882 3 ปีที่แล้ว +4

    crystal clear explanation, thank you David!

    • @Firebase
      @Firebase  3 ปีที่แล้ว +1

      Glad you enjoyed it!

  • @jameshegedus9836
    @jameshegedus9836 7 ปีที่แล้ว +3

    Mint video David and co! Keen for the profiling comparison!

  • @JohnJohnson-ox3bu
    @JohnJohnson-ox3bu 7 ปีที่แล้ว +2

    Hello,
    Riot for sure should be one of the libraries you guys should cover and thank you guys for implementing cloud functions to firebase. That was the last missing peace for web app developers on your platform to be the best in the market!

  • @WittyGeek
    @WittyGeek 7 ปีที่แล้ว +1

    Already waiting for the next week's video! :)

  • @jincyquones
    @jincyquones 7 ปีที่แล้ว +11

    I love you Firebase.

  • @Raviniks
    @Raviniks 7 ปีที่แล้ว +2

    How firebase server side rendering can be used for SEO?
    Million thanks 😊
    I was waiting since 8 months for firebase to bring this server side rendering feature.
    Please do forecasts 3 times a week. You are my favourite firecast anchor 😊

  • @kikevanegazz325
    @kikevanegazz325 2 ปีที่แล้ว

    This was awesome!

  • @cutiko
    @cutiko 7 ปีที่แล้ว +2

    This introduction got me so hype!

  • @jaspeariv
    @jaspeariv 4 ปีที่แล้ว +5

    Me: can we take Colt Steele's courses?
    Mom: no, we have Colt Steele at home
    Colt Steele at home:

  • @CrewnieMasterDeveloper
    @CrewnieMasterDeveloper 7 ปีที่แล้ว

    I love Angular and now ... Firebase!!!

  • @houssainamrani3045
    @houssainamrani3045 7 ปีที่แล้ว +3

    This is awesome!! Thanks David :)

  • @whomerdoodles
    @whomerdoodles 2 ปีที่แล้ว

    Dude you saved my college essay

  • @xarzu
    @xarzu 5 ปีที่แล้ว

    Good video and much needed content !!

  • @AsifMehedi
    @AsifMehedi 7 ปีที่แล้ว

    Thank you for this video. It answers several questions I had about SSR. In addition to the process, the benefits and costs are also well-explained.

  • @tonykempson4331
    @tonykempson4331 7 ปีที่แล้ว

    Thanks David. Nice graphics.

  • @gaminggenes320
    @gaminggenes320 4 ปีที่แล้ว

    I just wondering if this "Server-Side Rendering" can help to solve the dynamic generation of Open Graph meta tags problem faced by social media crawler like Facebook?

  • @ss4pandaman
    @ss4pandaman 7 ปีที่แล้ว +1

    Can we get a tutorial on how to do this with vanilla jJavaScript custom elements? It seems weird to cover server side rendering g of component driven frameworks without doing vanilla custom elements.

  • @BrunoGiubilei
    @BrunoGiubilei 7 ปีที่แล้ว

    i´m started develop my app using framework7+vuejs+webpack+cordova and i has get a simple exemple of SSR, but i abandoned the project and restart using only framework7+cordova, because the sintaxe of vuejs is totaly diferent for me, please begin the next video showing a vuejs exemple. thanks

  • @XLpacman805
    @XLpacman805 7 ปีที่แล้ว

    Also good video, easy to watch.

  • @mrtarunnagpal
    @mrtarunnagpal 6 ปีที่แล้ว

    Thanks for the explanation

  • @pandarzzz
    @pandarzzz 6 ปีที่แล้ว

    Thank you for sharing this informative video! 😺🖐

  • @grimonce
    @grimonce 2 ปีที่แล้ว

    How is this different to things like Django or other server side 'full stack' frameworks? Isn't rails doing that? I thought we were past this point...?
    Am I misunderstanding anything? We're basically sending a prerendered html as a response right?

    • @denis-kravets
      @denis-kravets 2 ปีที่แล้ว

      Not exactly, but your comment make sense. The think you've missed is that it's "applicable only to the first render". Treat this as "those cards in facebook, while waiting for the site to load", but instead of a dummy preloader -> it's a preloader with a real content of user site, until JS kicks-in))))

  • @ivankuznetsov995
    @ivankuznetsov995 7 ปีที่แล้ว +5

    Is there place I can buy this wooden Firebase logo like on David's macbook?

    • @Raviniks
      @Raviniks 7 ปีที่แล้ว

      Ivan Kuznetsov hahahah

    • @DanielRLuke
      @DanielRLuke 7 ปีที่แล้ว

      I thought it was a Google FireBook

  • @prachigarg7161
    @prachigarg7161 2 ปีที่แล้ว

    can we use withRouter HOC from React-router-dom in server side rendering as well?

  • @adambernath
    @adambernath 4 ปีที่แล้ว

    is there a way to use ssr without frameworks, just plain vanilla js, css and html?
    I only see solutions for react, next nuxt etc. and I dont like excess crap for a simple blog or a few page website

  • @ahmedbenltaief4024
    @ahmedbenltaief4024 7 ปีที่แล้ว

    Hello, please tell me, is server rendering too important thing to know? will all web applications in future work with server side rendering?

  • @saurabhmangal6322
    @saurabhmangal6322 5 ปีที่แล้ว

    How can I know if my server (website host) allows me to give a service to my users where I let them download a pdf based on the text/spacing options selected by them on a HTML form. Is there any free service which can be installed on the webserver?

  • @pragatidugar
    @pragatidugar 5 ปีที่แล้ว

    Hi, In my angular app ,I am facing the issue that on home page there are lot of external libraries(hosted in cdn) which needs to load ,so it takes a lot of time in initial page rendering, So is SSR an solution to it?? Is there any other possibility to solve this i.e minimize initial page load time ??

  • @stoneshou
    @stoneshou 2 ปีที่แล้ว

    Is there any benchmarking on how much SSR improves the first load latency?
    Also, it almost seems that SSR is solely beneficial for the first load use case, can it be useful elsewhere?

    • @sudarshanmg2604
      @sudarshanmg2604 ปีที่แล้ว +1

      Yeah... SSR is also useful for search engine crawlers(bots), for SEO. You can learn more about it if you google.

  • @juanyang838
    @juanyang838 5 ปีที่แล้ว

    So which one is getting rendered first? server-side, or client-side?

  • @Chaaos2
    @Chaaos2 7 ปีที่แล้ว +62

    Lets call it Isomorphic javascript to confuse all the new kids

    • @edwingarcia5043
      @edwingarcia5043 5 ปีที่แล้ว +2

      Holy man I just read that thing of Isomorphic but still with some confusing things

    • @Hasnain1F
      @Hasnain1F 5 ปีที่แล้ว +2

      I read it, says it's like SSR where it is rendered on server and sent to the client while in the background the JS bundle for the SPA downloads. The difference? No idea. But that's okay, will see about it.

  • @mohammedabraruddin9779
    @mohammedabraruddin9779 5 ปีที่แล้ว

    I like Thumps Up and here is one for you

  • @jofftiquez
    @jofftiquez 7 ปีที่แล้ว +20

    Nuxt first please!

  • @jdotsystem
    @jdotsystem 4 ปีที่แล้ว

    Angular is working client side
    So it is nun sense to connect database from client directly
    I think we don't need database connection in client side

  • @heratpatel7174
    @heratpatel7174 7 ปีที่แล้ว

    Wow it will be enjoying

  • @holyash6068
    @holyash6068 7 ปีที่แล้ว +2

    Please include polymer 2.0 too

  • @mathewsjoseph2161
    @mathewsjoseph2161 7 ปีที่แล้ว

    Hey Firebase! Thank you for the video. I would also like to see some videos on SSR with Polymer.

  • @DrewLandgrave
    @DrewLandgrave 7 ปีที่แล้ว

    Could you yeah about anything that needs to be done with ionic3 and angular

  • @prototype19891
    @prototype19891 7 ปีที่แล้ว

    Angular/React would be good for next video.

  • @grop2121
    @grop2121 7 ปีที่แล้ว

    what I can do for fix in xcode9 I can't connect (enable)???

  • @DanielGherard
    @DanielGherard 7 ปีที่แล้ว +2

    Can Polymer Elements be used in SSR?

    • @EnriqueQuerol
      @EnriqueQuerol 7 ปีที่แล้ว +1

      Daniel Gherard good question, what about Polymer and Web Components?

    • @adamleblanc5294
      @adamleblanc5294 7 ปีที่แล้ว

      Yes.

    • @DanielGherard
      @DanielGherard 7 ปีที่แล้ว

      Ok. Thanks. I'll check it out.

  • @qalqi
    @qalqi 7 ปีที่แล้ว

    How to host a password protected page/PDF/asset with server side rendering?

  • @XLpacman805
    @XLpacman805 7 ปีที่แล้ว +1

    I found this video from the Angular Gitter chatroom

  • @PraneyBehl
    @PraneyBehl 7 ปีที่แล้ว +2

    Svelte.js would be a good contender I believe to be included.
    Thanks

  • @BearkFearGamer
    @BearkFearGamer 5 ปีที่แล้ว

    Show how to use Next,js and React.js

  • @khalidsalman5632
    @khalidsalman5632 2 ปีที่แล้ว

    What will you say about BUN?

  • @daanishr
    @daanishr 7 ปีที่แล้ว +1

    More more more!

  • @HaniYahya9
    @HaniYahya9 7 ปีที่แล้ว +1

    Just thumbed you up!

  • @CsabaKissColorado
    @CsabaKissColorado 6 ปีที่แล้ว

    Please add Marko framework. It's fast and easy to learn.

  • @danvilela
    @danvilela 4 ปีที่แล้ว

    So basically SSR is what we always had automatically before SPAs? Like PHP, or cshtml? Why nobody compares SSR with these?

  • @greatramu86
    @greatramu86 7 ปีที่แล้ว +4

    NUXT please

  • @sakules
    @sakules 6 ปีที่แล้ว

    how do you explain this to a customer

  • @bookstylus4525
    @bookstylus4525 7 ปีที่แล้ว +3

    Vue and Nuxt!

  • @SeloToprakus
    @SeloToprakus 6 ปีที่แล้ว

    Ionic Framework ?

  • @sebastianromeroR
    @sebastianromeroR 7 ปีที่แล้ว

    What about Thymeleaf?

  • @nikhilagarwal5326
    @nikhilagarwal5326 7 ปีที่แล้ว +3

    Please cover React first.

  • @glauberbispo8922
    @glauberbispo8922 2 ปีที่แล้ว

    I don't know dude, i have a feeling that this video is a firehost ad :v

  • @mikekaranja63
    @mikekaranja63 7 ปีที่แล้ว +1

    Hi please add nuxt.js, It is similar to vue js.

    • @dassurma
      @dassurma 7 ปีที่แล้ว

      As far as I know, they are in fact _so_ similar, that the techniques for VueJS can be applied to NuxtJS.

  • @ronnymichael3023
    @ronnymichael3023 7 ปีที่แล้ว +22

    No polymer? :/

  • @TheGrafox
    @TheGrafox 7 ปีที่แล้ว +6

    Angular first PLZ :)

  • @fkxfkx
    @fkxfkx 6 ปีที่แล้ว

    Flutter, baby.

  • @yun-ruzeng5026
    @yun-ruzeng5026 3 ปีที่แล้ว

    great

  • @rickyu1978
    @rickyu1978 6 ปีที่แล้ว

    Waiting for a room with a vue.

  • @karanveermahajan6206
    @karanveermahajan6206 6 ปีที่แล้ว

    NodeJs please !

  • @Publiminal
    @Publiminal 7 ปีที่แล้ว

    NEXT !

  • @sakethkulapaka7820
    @sakethkulapaka7820 6 ปีที่แล้ว

    waiting for vue.js

  • @georgefromvienna
    @georgefromvienna 7 ปีที่แล้ว

    ssr 4 angular please!

  • @stevefinity7659
    @stevefinity7659 2 ปีที่แล้ว

    If you live in germany you dont have to simulate a slow internet connection ;-)

  • @Megastaru
    @Megastaru 7 ปีที่แล้ว

    Vue Js please

  • @hudsontaylor2515
    @hudsontaylor2515 6 ปีที่แล้ว

    Express JS?

  • @vnabet
    @vnabet 7 ปีที่แล้ว

    Angular first pls !

  • @not_enoughmana
    @not_enoughmana 6 ปีที่แล้ว

    The sound effects are distracting and sound like a phone noise

  • @BruceArmstrong09121997
    @BruceArmstrong09121997 4 ปีที่แล้ว

    the BGM!!!!!!!!!!!!!!!!!!

  • @Publiminal
    @Publiminal 7 ปีที่แล้ว

    NEXT FIRST !

  • @mechantl0up
    @mechantl0up 3 ปีที่แล้ว

    Use vanilla JS in place of the slow and heavy frameworks, and you have no need for server side rendering.

  • @originative
    @originative 3 ปีที่แล้ว

    Why should one use these js frameworks in the first place, use good server side language like PHP, JAVA, C#,Ruby to generate the desired HTML

  • @phurien
    @phurien 4 ปีที่แล้ว

    React on meteor!

  • @HunnyCoders
    @HunnyCoders 4 ปีที่แล้ว

    NEXT first.

  • @naveendhayanidhi2117
    @naveendhayanidhi2117 7 ปีที่แล้ว +1

    Riot.js please!!

    • @dane3654
      @dane3654 6 ปีที่แล้ว

      Yeeeaaa!

  • @MetalStorm66
    @MetalStorm66 7 ปีที่แล้ว

    Reaaact first pls. 👍

  • @steveboyd9805
    @steveboyd9805 6 ปีที่แล้ว

    I'd like to see a video on Aurelia. I've build an app with Aurelia and Firebase (isopro.solutions) and I'd like to get SSR working.
    Thanks!

  • @alvinkonda
    @alvinkonda 7 ปีที่แล้ว

    VueJS baby

  • @MohamedNasserallah
    @MohamedNasserallah 7 ปีที่แล้ว

    Vue js

  • @karthikpuvvula
    @karthikpuvvula 3 ปีที่แล้ว

    Still a Mac Book bro.. 😂

  • @dhanush-blr
    @dhanush-blr 7 ปีที่แล้ว

    Node js

  • @kaflan-kun
    @kaflan-kun 7 ปีที่แล้ว

    Senks

  • @julianklumpers
    @julianklumpers 7 ปีที่แล้ว +2

    React please

    • @SaroVindigni
      @SaroVindigni 7 ปีที่แล้ว

      Julian Klumpers i have an example with nextjs here => github.com/Bolket/next-firebase-functions

  • @andreasahlborg9629
    @andreasahlborg9629 7 ปีที่แล้ว

    react

  • @RajKumar-kt5pd
    @RajKumar-kt5pd 6 หลายเดือนก่อน

    It's promotion video, not useful

  • @jesusalexis7342
    @jesusalexis7342 7 ปีที่แล้ว +3

    Firebase les falta un canal en español 😭

  • @jonforhan9196
    @jonforhan9196 ปีที่แล้ว

    soydev

  • @wobsoriano
    @wobsoriano 7 ปีที่แล้ว

    jQuery please
    just kidding

  • @Publiminal
    @Publiminal 7 ปีที่แล้ว

    NEXT !

  • @GeordyJames
    @GeordyJames 7 ปีที่แล้ว

    Vue Js please

  • @TimothyWillis1981
    @TimothyWillis1981 7 ปีที่แล้ว

    riotjs please.