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

Intro to Astro

Avatar for Dimitri Dimitri
March 14, 2023
Programming
0
160

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
Tweet

More Decks by Dimitri

See All by Dimitri
Moduliths
Avatar for Dimitri g00glen00b
0
130
Tech talk: Micronaut
Avatar for Dimitri g00glen00b
0
230
Better monitoring with Spring boot Actuator
Avatar for Dimitri g00glen00b
0
350
From WordPress to Gatsby
Avatar for Dimitri g00glen00b
3
400
GraphQL
Avatar for Dimitri g00glen00b
1
290
Reactive programming with Spring boot 2
Avatar for Dimitri g00glen00b
1
420
Introduction to Meteor
Avatar for Dimitri g00glen00b
0
490
JavaScript essentials
Avatar for Dimitri g00glen00b
3
460
Fronteers - JavaScript at your enterprise (Dutch)
Avatar for Dimitri g00glen00b
0
240

Other Decks in Programming

See All in Programming
車輪の再発明をしよう！PHP で実装して学ぶ、Web サーバーの仕組みと HTTP の正体
Avatar for H1R0 h1r0
2
450
それはエンジニアリングの糧である：AI開発のためにAIのOSSを開発する現場より / It serves as fuel for engineering: insights from the field of developing open-source AI for AI development.
Avatar for nrs nrslib
1
690
AI 開発合宿を通して得た学び
Avatar for ニフティ株式会社 niftycorp
PRO
0
180
Tamach-sre-3_ANDPAD-shimaison93
Avatar for shimaison93 mane12yurks38
0
200
仕様漏れ実装漏れをなくすトレーサビリティAI基盤のご紹介
Avatar for Kuniwak orgachem
PRO
7
3.6k
Codex CLI でつくる、Issue から merge までの開発フロー
Avatar for amata1219 amata1219
0
250
Cyrius ーLinux非依存にコンテナをネイティブ実行する専用OSー
Avatar for n4mlz n4mlz
0
260
へんな働き方
Avatar for Yusuke Wada yusukebe
6
2.9k
L’IA au service des devs : Anatomie d'un assistant de Code Review
Avatar for Thomas Boileau toham
0
150
Codex の「自走力」を高める
Avatar for yorifuji yorifuji
0
1.3k
Agentic AI: Evolution oder Revolution
Avatar for Lars Roewekamp mobilelarson
PRO
0
220
Coding as Prompting Since 2025
Avatar for Jimmy Moon ragingwind
0
490

Featured

See All Featured
世界の人気アプリ100個を分析して見えたペイウォール設計の心得
Avatar for Akihiro Kokubo akihiro_kokubo
PRO
68
38k
Side Projects
Avatar for Sacha Greif sachag
455
43k
Winning Ecommerce Organic Search in an AI Era - #searchnstuff2025
Avatar for Aleyda Solis aleyda
1
1.9k
The Web Performance Landscape in 2024 [PerfNow 2024]
Avatar for Tammy Everts tammyeverts
12
1.1k
VelocityConf: Rendering Performance Case Studies
Avatar for Addy Osmani addyosmani
333
24k
HU Berlin: Industrial-Strength Natural Language Processing with spaCy and Prodigy
Avatar for Ines Montani inesmontani
PRO
0
300
How STYLIGHT went responsive
Avatar for nonsquared nonsquared
100
6k
Large-scale JavaScript Application Architecture
Avatar for Addy Osmani addyosmani
515
110k
AI Search:
Where Are We & What Can We Do About It?
Avatar for Aleyda Solis aleyda
0
7.2k
Build The Right Thing And Hit Your Dates
Avatar for Maggie C. maggiecrowley
39
3.1k
Music & Morning Musume
Avatar for Bryan Veloso bryan
47
7.1k
How To Stay Up To Date on Web Technology
Avatar for Chris Coyier chriscoyier
790
250k

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!