PWA starter kit: build fast, scalable, modern apps with Web Components (Google I/O '18)

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

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

  • @dekutree5979
    @dekutree5979 6 лет назад +66

    Google needs to buy Nintendo just so Monica can make references without worrying about copyright.

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

    I just met Monica and I'm already "My God, she understands what I need!" Congratulations on the way you engage the audience, you are awesome
    .

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

    So this talk is 90% about how a react-redux app works and 10% about the implementation of PWAs but with a cool presentation.

  • @FilmonGEMZ
    @FilmonGEMZ 4 года назад +17

    The only thing I wished would change is the audience. There's almost no laughing or responses. Or maybe I can't hear it. In general though, I wish Tech audiences would be more encouraging to speakers.

  • @debkanchan
    @debkanchan 6 лет назад +18

    Her presentations are always great

  • @QLNPRSU
    @QLNPRSU 6 лет назад +20

    pwa-starter-kit -> 658MB on disk (after npm install), 550+ npm packages. Why does all starter kits need to be so massive?

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

      1 single asset for a game can be 1 gig during development of the asset, like a 3d model. But after the game is compiled, the asset is barely noticeable on the disk. So try building the pwa-starter-kit in that initial state ready for deployment. Tell me how big that production build is. Don't really care how big the software is before optimizations and building.

  • @PavelIsp
    @PavelIsp 6 лет назад +102

    Anyone notice that she's actually wearing the...BANANA PANTS?

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

      I thought the same the moment she says BANANA PANTS 😆

    • @lionelt.9124
      @lionelt.9124 3 года назад +1

      @@iamrohandatta The expression banana pants is a new one on me.

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

    This women is great and presentation was perfect. Not like many other. This is one of the best PWA video.

  • @CodingPhase
    @CodingPhase 6 лет назад +10

    Yea i like here presentations its not boring very engaging

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

    Such a great talk! Fun and informative all the way through.

  • @vinerz
    @vinerz 6 лет назад +35

    What a fun and great presentation! Monica is the best!!!

  • @stereopticon
    @stereopticon 6 лет назад +2

    Was watching this for content, very engaging speaker, enjoying the presentation, communication skills. Working from home. Then, I noticed my 12 yr old daughter watching over my shoulder, entranced. She's a huge Zelda fan, BTW.

  • @MikeWiering
    @MikeWiering 6 лет назад +38

    Good presentation, but I wish they would have placed that microphone better so she wouldn't be blowing into it all the time.

  • @danf1862
    @danf1862 6 лет назад

    Thanks Monica and the Polymer team! I can't wait to get crackin on the new starter kit

  • @JoeWong81
    @JoeWong81 6 лет назад

    Love the analogy to video games...And now I remember how awesome the Zelda games are.

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

    PERFECT presentation WITH funky STYLE. braVVVooo!

  • @haydenbraxton628
    @haydenbraxton628 6 лет назад +4

    "That's banana pants" - I'm stealing this. Thank you!

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

    I can't believe this is already 2 years ago

  • @NicolasSauveur
    @NicolasSauveur 6 лет назад

    Thank you Monica for another great presentation. Can't wait to try pwa-starter-kit for my side-projects.

  • @FrederikDussault
    @FrederikDussault 6 лет назад +3

    Amazing presentation!!
    Developping has never been so fun. :-)

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

    What's odd is that there is an earlier pitch from the Polymer team that has been taken down.... If this was 0.8 or 0.9, I wonder what 0.7 looked like?

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

    I'd wish I had public speaking skills like this!

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

    A game. Great. Lead down another garden path of programming ambiguity.

  • @wendelldejelo7944
    @wendelldejelo7944 6 лет назад +11

    always love monica's presentation!

  • @lzantal
    @lzantal 6 лет назад

    She is an incredible speaker. Super engaging speaker.

  • @FrederikDussault
    @FrederikDussault 6 лет назад +6

    Polymer/pwa-starter-kit Github repo:
    github.com/Polymer/pwa-starter-kit

  • @chunckyfreshnut
    @chunckyfreshnut 6 лет назад

    Some many things to install . I am not sure why they killed off angular 1? It so much easier to use and learn. Make it easy for people to learn how to use.

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

    Great idea to gamify PWA presentation :)

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

      @TheGameMakeGuy not according to the dictionary - "The application of typical elements of game playing (e.g. point scoring, competition with others, rules of play) to other areas of activity, typically as an online marketing technique to encourage engagement with a product or service.
      "
      It's also spelt 'gamification'.
      :)

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

    Excellent Presentation

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

    I love that presentation

  • @d4m1n
    @d4m1n 6 лет назад +8

    Awesome 🔥! I think this is a great on-boarding resource for new Web Developers. Friendly and to the point, thank you Monica!

  • @JuanCarlosMadrigal
    @JuanCarlosMadrigal 6 лет назад

    Always love the Monica's presentations, they're always fun, like this one with the video game and the sounds like Mario Bros. she made for it, but more important, they're also so much informative, really cool presentation!

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

    Did she NOT mentioned about service workers at all????

  • @nevillelusimba1689
    @nevillelusimba1689 6 лет назад

    3:1, awesome analogy. ABC

  • @xWe2s
    @xWe2s 6 лет назад +10

    "The web is pretty great". Yea, we deserve that. How many horrific years we lived.

  • @julian_pp
    @julian_pp 6 лет назад +1

    Thank you, it's very useful

  • @chakree100
    @chakree100 6 лет назад

    I don’t know may be I’m new to PWA may be but majority of it bounced over! Can anyone refer me to any prerequisite content if possible? I’m new to polymer as well!

  • @MrJohn360
    @MrJohn360 6 лет назад

    Damn, that's neat advice and fun to watch.

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

    Is there any Update in Google I/O '19?

  • @boot-strapper
    @boot-strapper 5 лет назад +3

    looks like reinventing the react wheel

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

      ten minutes in and im like, wait a minute ...

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

    Haha IE 11? I thought the IE has been replaced by Edge. IE sounds classic nowadays.😁

  • @johnpage5500
    @johnpage5500 6 лет назад

    Wouldn't it be great if prpl-server were included in Firebase static hosting? I'd just upload a builds.json, a push-manifest.json and a cache-control.json and everything would be properly handled.

    • @visitforthemusic
      @visitforthemusic 6 лет назад

      I imagine it is a cost thing at the moment - but I agree that is the next area which needs to be tackled as "static" hosting isn't really enough and I am sure it is being considered.
      Following all performance best practices (optimising critical path, progressive transpilation, effective caching strategies) and getting SSR, HTTP/2 push, offline caching with service workers, all singing in harmony is a lovely vision but at present seems to involve masses of complexity and coordination between build, deployment and hosting processes.
      Cloudflare Workers are the closest thing of which I am aware to this vision - in so much as they allow for custom logic to run for each and every request to a traditionally "static" CDN: blog.cloudflare.com/cloudflare-workers-unleashed.

  • @ReidMewborne
    @ReidMewborne 6 лет назад

    haven't seen support for safari yet. could you expand on this? thanks

  • @ankitmaheshwari3643
    @ankitmaheshwari3643 6 лет назад

    Web components are not available at webcomponents.org for Polymer 3.
    From where do we use components to design pages.?

  • @Mhblabla
    @Mhblabla 6 лет назад +49

    Oh god. The Polymer team made a copy of React.

    • @Odisej1
      @Odisej1 6 лет назад +2

      Marko Hrovatič I was thinking the same .... this is just React js

    • @marlonallansupetran7120
      @marlonallansupetran7120 6 лет назад

      That's what I also thought!

    • @davidmaxwaterman
      @davidmaxwaterman 6 лет назад +12

      Except not really, no.

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

      Nope Polymer has been around before reactjs only back then it was too slow to be adapted (I used polymer before but abandoned using it because of too much files being added to my project hierarchy, similar to what node_modules but much worst). Then It was copied by facebook and called it reactJs and successfully made it faster and lite. Now Polymer is going back to where it started via PWA

  • @GlenSmith
    @GlenSmith 6 лет назад

    Nutella on Pancakes :) sweet video & very inspirational for the Polymer Project.

  • @DreadKnight666
    @DreadKnight666 6 лет назад

    Cool! Du du du du du, boop boop boop!

  • @FilipMatuszewski
    @FilipMatuszewski 6 лет назад

    How to use typescript with this awesome starter kit.

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

    Is that React ?

  • @reddyashok9
    @reddyashok9 6 лет назад +6

    Great presentation 👍

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

    Can we tdd?

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

    If only there were 'the one good datepicker'

  • @kamalabuhenamostafa
    @kamalabuhenamostafa 6 лет назад

    Nice to see you again, Monica.

  • @rw7799
    @rw7799 6 лет назад +1

    just checked site out,,what is redux? go to redux page.... read it..repeat question.. what is redux?

    • @BrianMuthomi
      @BrianMuthomi 6 лет назад

      wait a couple of days, visit redux page ...read .... what is redux?

  • @abanoubhanna7175
    @abanoubhanna7175 6 лет назад

    WoOoOoOoOoOoW G R E A T P R E S E N T A T I O N !

  • @FrederikDussault
    @FrederikDussault 6 лет назад

    Please add links to github repos. Thanks

  • @tudorhulban2817
    @tudorhulban2817 6 лет назад +2

    would be nicer in vanilla

  • @Gerrymon
    @Gerrymon 6 лет назад

    1:58 lol yeah that's me~

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

    This is one of those moments when I'm proud to be romanian :))

  • @EdmundCiegoBelize
    @EdmundCiegoBelize 6 лет назад +36

    who says banana pants??

    • @andrewtfluck
      @andrewtfluck 6 лет назад +2

      only the best :P

    • @jamiemaher2341
      @jamiemaher2341 6 лет назад +2

      It sounds like one of those things where someone tells you to squeeze a funny word into your presentation without anyone noticing. Someone must have told her to say it because of her trousers.

    • @chucksupport
      @chucksupport 6 лет назад +2

      someone who wears Banana pants

    • @JimTipping
      @JimTipping 6 лет назад +3

      Someone *wearing* banana pants!

    • @SirFaceFone
      @SirFaceFone 6 лет назад +2

      Banana PWAnts

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

    What ever happened to polymer?

  • @jf-rr3gz
    @jf-rr3gz 6 лет назад +1

    Are you targeting "adults" with this presentation? I made it to about 8 minutes - is that good?

  • @oleggorbatiuk4029
    @oleggorbatiuk4029 6 лет назад

    Очень круто!)

  • @vincepalejr6621
    @vincepalejr6621 6 лет назад

    Lol Banana Pants.. You're wearing banana pants.

  • @montesajudy
    @montesajudy 6 лет назад +1

    "mouth sound, it will get you anywhere" hmmmmm.

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

    ABC: Always Be Closing.

  • @kikobeats
    @kikobeats 6 лет назад

    Monica rocks

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

    I got turned off when i saw html code inside the js. I really don't like it.

    • @andyedwards9011
      @andyedwards9011 6 лет назад

      Well, have fun making intricate, dynamic web pages and components without HTML inside JS. React went this way, and now Polymer followed its lead, because it's an extremely effective way to render dynamic content.

  • @albiceleste101
    @albiceleste101 6 лет назад

    I do like them but why is google trying to push PWAs so hard

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

    She talks ALOT! I like her already.

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

    lol start in seconds? npm i takes like 3-20 min on my machine....

  • @heratpatel7174
    @heratpatel7174 6 лет назад +1

    Hi why we need Lit html. There is React jsx works same as Lit Html.

    • @jonaseriksson5750
      @jonaseriksson5750 6 лет назад +6

      Benefits over JSX
      Native syntax
      No tooling required. Understood by all JS editors and tools.
      No VDOM overhead
      lit-html only re-renders the dynamic parts of a template, so it doesn't produce a VDOM tree of the entire template contents, it just produces new values for each expression. By completely skipping static template parts, it saves work.
      Scoped
      JSX requires that the compiler be configured with the function to compile tags to. You can't mix two different JSX configurations in the same file.
      The html template tag is just a variable, probably an imported function. You can have any number of similar functions in the same JS scope, or set html to different implementations.
      Templates are values
      JSX translates to function calls, and can't be manipulated on a per-template basis at runtime. lit-html produces a template object at runtime, which can be further processed by libraries like ShadyCSS.
      CSS-compatible syntax
      Because template literals use ${} as the expression delimiter, CSS's use of {} isn't interpreted as an expression. You can include style tags in your templates as you would expect:
      html`
      :host {
      background: burlywood;
      }
      `github.com/Polymer/lit-html

  • @codinggames8672
    @codinggames8672 6 лет назад

    I like chrome

  • @Fik0n
    @Fik0n 6 лет назад

    What about iOS support?

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

    very google like----I mean office google--corporate google

  • @ritizbehl6386
    @ritizbehl6386 6 лет назад +8

    another React lol

  • @martinrj30
    @martinrj30 6 лет назад

    vid links (coz the slides didn't get published yet ...)
    github.com/polymer/pwa-starter-kit
    github.com/polymer/pwa-starter-kit/wiki
    github.com/polymer/lit-element
    github.com/polymer/pwa-helpers
    git clone pwa-starter-kit my-new-app
    npm install
    npm start
    npm test
    npm run build
    npm run serve
    npm run test:unit
    npm run test:integration
    npm run build:prpl-server
    npm run serve:prpl-server
    pwa-starter-kit.appspot.com

  • @random-code1
    @random-code1 6 лет назад

    So by the chart, 0 effort would have a good result as well 🤔 nice

  • @CopernicoTube
    @CopernicoTube 6 лет назад +1

    Still waiting for a web solution that allow web applications to be reliable and simple to develop out the box, as desktop/mobile or even server side does.
    The old Polymer make this promise and fail, miserably.
    I think that we should abandon web applications for good (utopia, I know) as the issue of updatable local apps was solved on mobile.

  • @uphumor9128
    @uphumor9128 6 лет назад

    hahahhaha - that was funny

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

    Сточе. Оти. Ме. Офрливте дансо врбоски

  • @JasonFavrod1
    @JasonFavrod1 6 лет назад +1

    IDK, i think she was talking too fast.