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

Intro to Astro

Sponsored · SiteGround - Reliable hosting with speed, security, and support you can count on. →
Avatar for Dimitri Dimitri
March 14, 2023
Programming
180
0

Intro to Astro

This presentation contains an introduction to Astro by creating a Pokédex using the PokéAPI.

Avatar for Dimitri

Dimitri

March 14, 2023

More Decks by Dimitri

See All by Dimitri
Moduliths
Avatar for Dimitri g00glen00b
0
140
Tech talk: Micronaut
Avatar for Dimitri g00glen00b
0
240
Better monitoring with Spring boot Actuator
Avatar for Dimitri g00glen00b
0
350
From WordPress to Gatsby
Avatar for Dimitri g00glen00b
3
410
GraphQL
Avatar for Dimitri g00glen00b
1
300
Reactive programming with Spring boot 2
Avatar for Dimitri g00glen00b
1
440
Introduction to Meteor
Avatar for Dimitri g00glen00b
0
510
JavaScript essentials
Avatar for Dimitri g00glen00b
3
470
Fronteers - JavaScript at your enterprise (Dutch)
Avatar for Dimitri g00glen00b
0
260

Other Decks in Programming

See All in Programming
霧の中の代数的エフェクト
Avatar for funnycat funnyycat
1
340
えっ!!コードを読まずに開発を!?
Avatar for はなのうち hananouchi
0
180
AIを活用したE2Eテスト実装効率化のあゆみ / ebisu-mobile-14-kotetu
Avatar for kotetu (kotetuco) kotetuco
0
170
「なぜそう決めたのか」を残し続ける仕組み ― Notion AI カスタムエージェント × Slack連携による設計判断の自動記録 - NIKKEI Tech Talk #47
Avatar for ニフティ株式会社 niftycorp
PRO
0
260
Language Server 使ってる？ 〜VSCode と Zed の場合〜 / Are you using a Language Server? ~For VS Code and Zed~
Avatar for NAGATA Hiroaki handlename
0
840
Haskell/Servantを通してWebミドルウェアを捉え直す
Avatar for pizzacat83 pizzacat83
1
480
AI 輔助遺留系統現代化的經驗分享
Avatar for James Wang jame2408
1
1.2k
Welcome to the "Parametricity" 🏙️ − Generic だけど Specific な世界 −
Avatar for TAKASE Kazuyuki guvalif
PRO
1
150
act2-costs.pdf
Avatar for Sumedh Bala sumedhbala
0
110
スマートグラスで並列バイブコーディング
Avatar for Hayami Shuhei hyshu
0
290
【やさしく解説 設計編 #1】「ドメイン駆動」と「実装駆動」ってなに？ 〜設計の考え方を、たとえ話で学ぼう〜
Avatar for HideyukiKitao panda728
PRO
1
110
Go1.27で導入されるジェネリクスメソッドでできること
Avatar for mackee mackee
0
280

Featured

See All Featured
Avoiding the “Bad Training, Faster” Trap in the Age of AI
Avatar for Mike Taylor tmiket
0
190
Applied NLP in the Age of Generative AI
Avatar for Ines Montani inesmontani
PRO
4
2.4k
brightonSEO & MeasureFest 2025 - Christian Goodrich - Winning strategies for Black Friday CRO & PPC
Avatar for Christian Goodrich cargoodrich
3
750
Game over? The fight for quality and originality in the time of robots
Avatar for Wayne Barker wayneb77
1
220
Responsive Adventures: Dirty Tricks From The Dark Corners of Front-End
Avatar for Vitaly Friedman smashingmag
254
22k
How to Get Subject Matter Experts Bought In and Actively Contributing to SEO & PR Initiatives.
Avatar for Liv Day livdayseo
0
150
Creating an realtime collaboration tool: Agile Flush - .NET Oxford
Avatar for Marc Duiker marcduiker
35
2.5k
SEO Brein meetup: CTRL+C is not how to scale international SEO
Avatar for Linda Hogenes lindahogenes
1
2.8k
The Impact of AI in SEO - AI Overviews June 2024 Edition
Avatar for Aleyda Solis aleyda
5
1.1k
Why Mistakes Are the Best Teachers: Turning Failure into a Pathway for Growth
Avatar for Umar Saidu Auna auna
0
180
The Illustrated Children's Guide to Kubernetes
Avatar for Chris Short chrisshort
51
52k
Odyssey Design
Avatar for Ryan Kendrick rkendrick25
PRO
2
730

Transcript

  1. Intro to Astro

  2. 👋 Who am I? • Dimitri “g00glen00b” Mestdagh • Full-stack

    developer at Optis • Works with Java and JavaScript • https://dimitri.codes • @g00glen00b

  3. 🚀 What is Astro?

  4. Key features • SSR / SSG framework • Integration with

    React, Vue, … • Server first • Zero JavaScript by default • Multi-Page Application

  5. Why SSR / SSG? Client-Side Server-Side Static Site Fast build

    time Dynamic content Interactive Good SEO Fast page serve ✔ ✔ ✔ ✔ ✔ ✔ ✔ ✔

  6. Why zero JavaScript? • No hydration • Less compute-heavy for

    browsers • Better performance • Less bandwidth • Astro Islands

  7. 󰳕 Live coding time!

  8. Conclusion

  9. Personal thoughts • Great Development Experience • Mind-switch SSG/MPA •

    Minimal IDE support

  10. Resources Code: https://github.com/g00glen00b/astro-pokedex

  11. Resources Blogpost: https://dimitri.codes/astro-pokedex/

  12. 🙏 Thank you for listening!