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

Intro to Astro

Avatar for Dimitri Dimitri
March 14, 2023
Programming
0
140

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
120
Tech talk: Micronaut
Avatar for Dimitri g00glen00b
0
210
Better monitoring with Spring boot Actuator
Avatar for Dimitri g00glen00b
0
320
From WordPress to Gatsby
Avatar for Dimitri g00glen00b
3
380
GraphQL
Avatar for Dimitri g00glen00b
1
270
Reactive programming with Spring boot 2
Avatar for Dimitri g00glen00b
1
390
Introduction to Meteor
Avatar for Dimitri g00glen00b
0
420
JavaScript essentials
Avatar for Dimitri g00glen00b
3
420
Fronteers - JavaScript at your enterprise (Dutch)
Avatar for Dimitri g00glen00b
0
210

Other Decks in Programming

See All in Programming
MCPで実現できる、Webサービス利用体験について
Avatar for syumai syumai
7
2.5k
JetBrainsのAI機能の紹介 #jjug
Avatar for yusuke yusuke
0
200
AI時代のドメイン駆動設計-DDD実践におけるAI活用のあり方 / ddd-in-ai-era
Avatar for MinoDriven minodriven
8
1.6k
대규모 트래픽을 처리하는 프론트 개발자의 전략
Avatar for Seungmin 마량 maryang
0
120
Understanding Ruby Grammar Through Conflicts
Avatar for yui-knk yui_knk
1
100
管你要 trace 什麼、bpftrace 用下去就對了 — COSCUP 2025
Avatar for shunghsiyu shunghsiyu
0
410
Vibe coding コードレビュー
Avatar for kinopee kinopeee
0
440
WebAssemblyインタプリタを書く ～Component Modelを添えて～
Avatar for ruccho ruccho
1
800
LLMは麻雀を知らなすぎるから俺が教育してやる
Avatar for po3rin po3rin
3
2.1k
A Gopher's Guide to Vibe Coding
Avatar for Daniela Petruzalek danicat
0
140
Strands Agents で実現する名刺解析アーキテクチャ
Avatar for omiya omiya0555
1
120
SwiftでMCPサーバーを作ろう！
Avatar for giginet giginet
PRO
2
240

Featured

See All Featured
The Art of Programming - Codeland 2020
Avatar for Erika Heidi erikaheidi
54
13k
Visualizing Your Data: Incorporating Mongo into Loggly Infrastructure
Avatar for mongodb mongodb
47
9.6k
Documentation Writing (for coders)
Avatar for Carmen Chung carmenintech
73
5k
Practical Tips for Bootstrapping Information Extraction Pipelines
Avatar for Matthew Honnibal honnibal
PRO
23
1.4k
Rebuilding a faster, lazier Slack
Avatar for samanthasiow samanthasiow
83
9.1k
Exploring the Power of Turbo Streams & Action Cable | RailsConf2023
Avatar for Kevin Liebholz kevinliebholz
34
6k
Designing for Performance
Avatar for Lara Hogan lara
610
69k
How STYLIGHT went responsive
Avatar for nonsquared nonsquared
100
5.7k
The Invisible Side of Design
Avatar for Vitaly Friedman smashingmag
301
51k
Become a Pro
Avatar for Speaker Deck speakerdeck
PRO
29
5.5k
The Cost Of JavaScript in 2023
Avatar for Addy Osmani addyosmani
53
8.8k
Done Done
Avatar for chrislema chrislema
185
16k

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!