Upgrade to Pro — share decks privately, control downloads, hide ads and more …

うじまるくんをつくろう! / うじまる生誕LT会 (2020/6/1)

うじまるくんをつくろう! / うじまる生誕LT会 (2020/6/1)

遊んだらぜひツイートしてみてください(OGP頑張ったので
https://uzimaru-maker.now.sh/

GitHub: https://github.com/dora1998/uzimaru-maker

Minoru Takeuchi

June 01, 2020
Tweet

More Decks by Minoru Takeuchi

Other Decks in Programming

Transcript

  1. ࢖͍ͬͯΔٕज़ • React޲͚UIϥΠϒϥϦ • ίϯϙʔωϯτͷཻ౓͸ Tailwind + α ͘Β͍ʁ •

    ΧϥʔύϨοτ΍ϨεϙϯγϒͳͲͷ ελΠϧγεςϜ׬උ • WAI-ARIA४ڌ
  2. ࢖͍ͬͯΔٕज़ • Canvas ͷඳըΛߦ͏ JS ϥΠϒϥϦ • React, Vue, Angular޲͚ʹ

    ެࣜͷαϙʔτϥΠϒϥϦ͕ଘࡏ • ό΢ϯσΟϯάϘοΫε΍ ΞχϝʔγϣϯͳͲ෯޿͘Χόʔ
  3. ը૾Λੜ੒͢ΔFunctionΛͭ͘Δ • node-canvas Λ࢖ͬͯɺSVG΍จࣈΛඳը • ೔ຊޠϑΥϯτΛ༻ҙ͠ͳ͍ͱ͍͚ͳ͍ • ࠷ॳ͸ Next.js ͷ

    API Routes Λ࢖ͬͯ΍Ζ͏ͱͨ͠ • JS/TS Ҏ֎ͷϑΝΠϧ͕όϯυϧͰ͖ͳ͍ʂ • Base64Ͱಡ·ͤͯ /tmp/ ʹॻ͖ࠐΉͷ΋ແཧ
  4. ґଘύοέʔδΛೖΕΔ • node-canvas ʹ͸ɺnpm֎ͷґଘϥΠϒϥϦ͕͋Δ • package.json ʹ now-build Λఆٛͯ͠ɺͦ͜Ͱ yum

    ͢Δ cf) ercel NowʢچZEIT Nowʣ্Ͱnode-canvasΛಈ͔͢ - Blanktar https://blanktar.jp/blog/2020/05/node-canvas-on-vercel-now