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

Intro to Astro

Avatar for Dimitri Dimitri
March 14, 2023
Programming
160
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
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
Nuxt Server Components
Avatar for wattanx wattanx
0
220
「効かない！」依存性注入（DI）を活用したAPI Platformのエラーハンドリング奮闘記
Avatar for Maki Hayashi mkmk884
0
280
GoのDB アクセスにおける 「型安全」と「柔軟性」の両立 - Bob という選択肢
Avatar for tak tak848
0
290
PHPで TLSのプロトコルを実装してみる
Avatar for higaki higaki_program
0
610
夢の無限スパゲッティ製造機 -実装篇- #phpstudy
Avatar for hideki kinjyo o0h
PRO
0
180
Migration to Signals, Signal Forms, Resource API, and NgRx Signal Store @Angular Days 03/2026 Munich
Avatar for Manfred Steyer manfredsteyer
PRO
0
200
「速くなった気がする」をデータで疑う
Avatar for Leaf senleaf24
0
110
存在論的プログラミング： 時間と存在を記述する
Avatar for Akihito Koriyama koriym
5
680
KagglerがMixSeekを触ってみた
Avatar for Morim morim
0
360
RailsのValidatesをSwift Macrosで再現してみた
Avatar for Takuma Shimizu hokuron
0
140
条件判定に名前、つけてますか？ #phperkaigi #c
Avatar for Hiromi Hishida 77web
2
890
2026-03-27 #terminalnight 変数展開とコマンド展開でターミナル作業をスマートにする方法
Avatar for SUZUKI Masashi masasuzu
0
260

Featured

See All Featured
Efficient Content Optimization with Google Search Console & Apps Script
Avatar for Katarina Dahlin katarinadahlin
PRO
1
440
Helping Users Find Their Own Way: Creating Modern Search Experiences
Avatar for Dan Newman danielanewman
31
3.1k
16th Malabo Montpellier Forum Presentation
Avatar for AKADEMIYA2063 akademiya2063
PRO
0
87
jQuery: Nuts, Bolts and Bling
Avatar for Doug Neiner dougneiner
66
8.4k
Facilitating Awesome Meetings
Avatar for Lara Hogan lara
57
6.8k
No one is an island. Learnings from fostering a developers community.
Avatar for Antonio thoeni
21
3.6k
Organizational Design Perspectives: An Ontology of Organizational Design Elements
Avatar for Dr. Kim W Petersen kimpetersen
PRO
1
660
Lightning Talk: Beautiful Slides for Beginners
Avatar for Ines Montani inesmontani
PRO
1
500
Getting science done with accelerated Python computing platforms
Avatar for Jacob Tomlinson jacobtomlinson
2
160
Digital Ethics as a Driver of Design Innovation
Avatar for Per Axbom axbom
PRO
1
250
Improving Core Web Vitals using Speculation Rules API
Avatar for Sergey Chernyshev sergeychernyshev
21
1.4k
HDC tutorial
Avatar for Michiel Stock michielstock
1
590

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!