Sign in

Sandro Maglione

@sandromaglione.bsky.social
171 followers 53 following 63 posts

The Coding Explorer 💻・Sharing patterns to build type-safe web & mobile apps・Typescript・Effect・React・XState Helping devs at typeonce.dev 🚀

PostsRepliesMedia
Sandro Maglione @sandromaglione.bsky.social · 23/12/2024
Using @tailwindcss.com for styling? Here are some not-obvious strategies to make your styles more composable (using v4) 🧱
210
Sandro Maglione @sandromaglione.bsky.social · 23/12/2024
Last release of the year in the newsletter, with a look back at everything that happened in 2024 And it happened a lot 🤯 www.sandromaglione.com/newsletter
000
Sandro Maglione @sandromaglione.bsky.social · 16/12/2024
✨ TypeScript tip ✨ A function that returns Tagged Classes 👉 Type a class with `new () => T` 👉 Required `Tag` type and value 👉 Return a class with `_tag` Call the function from `extends` to get the class 🪄
020
Sandro Maglione @sandromaglione.bsky.social · 16/12/2024
My writing 101 tips in this week newsletter I have been writing on the web for (more than) a few years now Exploring my setup and process this week 👇 www.sandromaglione.com/newsletter
000
Sandro Maglione @sandromaglione.bsky.social · 14/12/2024
The example that made me get CSS subgrid ✨ A superpower that can be used for many layouts www.typeonce.dev/article/the-...
010
Sandro Maglione @sandromaglione.bsky.social · 14/12/2024
Articles are coming to typeonce.dev 👀 For everything that doesn’t require long explanations, but just short and to-the-point examples 👇
000
Sandro Maglione @sandromaglione.bsky.social · 12/12/2024
New update on pubdev with package download count 👀 Turns out fpdart is downloaded 90_000 times each week 🙌 (number formatting intended)
010
Sandro Maglione @sandromaglione.bsky.social · 11/12/2024
This is what you get when you bet on @effect-ts.bsky.social and the community around it ✨
010
Sandro Maglione @sandromaglione.bsky.social · 10/12/2024
✨ TypeScript Tip ✨ Rest parameters: Allow passing any number of arguments to a function Make your API easier to use, avoiding multiple function calls 🤝
010
Sandro Maglione @sandromaglione.bsky.social · 09/12/2024
✨ TypeScript Tip ✨ Function overloads with types 👉 Wrap type in `{}` 👉 Provide 2 different signatures Allows to call the same function with different parameters, and different results Runtime problems may apply 🙌 This pattern is useful in library-land to provide a better API for the end user
020
Sandro Maglione @sandromaglione.bsky.social · 09/12/2024
Programming literacy in this week newsletter 💡 > The ability to read, write, and understand code; programming concepts, syntax, and semantics, as well as applying skills to solve problems and communicate ideas sandromaglione.com/newsletter
sandromaglione.com
First-draft thoughts on programming, web, games | Sandro Maglione
Every week I explore the sharp edge of web technologies delivering you unfiltered insights on my discoveries, so you can avoid my same mistakes.
000
Sandro Maglione @sandromaglione.bsky.social · 08/12/2024
✨ TypeScript Tip ✨ Type classes using `new` 👉 `new` keyword 👉 Constructor parameters inside `()` 👉 Class parameters after `=>` You can mark a type as a constructor signature, something that can be instantiated using `new` 👇
120
Sandro Maglione @sandromaglione.bsky.social · 06/12/2024
✨ Introducing ECS for TypeScript ✨ typeonce/ecs is a zero dependencies library to bring the Entity Component System pattern in your game Simple, working with any renderer, type safe and composable 🕹️ github.com/typeonce-dev...
github.com
GitHub - typeonce-dev/ecs: Entity Component System (ECS) implementation in TypeScript, extensible, working with any renderer, type safe and composable 🕹️
Entity Component System (ECS) implementation in TypeScript, extensible, working with any renderer, type safe and composable 🕹️ - typeonce-dev/ecs
010
Sandro Maglione @sandromaglione.bsky.social · 03/12/2024
Systems in ECS just got a simple as it gets 🕹️ Define systems, dependencies, and input all type safe and inferred for you ☑️ Components ☑️ Systems ☑️ Entities Closer to the full API 🔜
010
Sandro Maglione @sandromaglione.bsky.social · 02/12/2024
ECS + @pixijs.com + MatterJS = 🕹️ Compose systems to build a complex game with physics and rendering ECS keeps everything organized and under control 🫡
020
Sandro Maglione @sandromaglione.bsky.social · 02/12/2024
Have you ever considered making a game? Well, then you should learn about Entity Component System 🕹️ An introduction for you in this week newsletter 👇 sandromaglione.com/newsletter
010
Sandro Maglione @sandromaglione.bsky.social · 01/12/2024
Integrate physics with matterjs and ECS in your game 🧱 Each system as simple as it gets, a function and a query is all you need 👇
010
Sandro Maglione @sandromaglione.bsky.social · 01/12/2024
Making the API as simple and safe in my ECS in TypeScript 🕹️ Define a component with a simple class, auto tagged and ready to use Simple and safe 🪄
010
Sandro Maglione @sandromaglione.bsky.social · 28/11/2024
Working Entity Component System with TypeScript in action 🕹️ Simple architecture for organised code and powerful results 👇
010
Sandro Maglione @sandromaglione.bsky.social · 27/11/2024
ECS implementation in TypeScript achieved 🫡 TypeScript only, extensible, working with any renderer, type safe and composable 🕹️ May be the beginning of something #game-development #typescript #games #ecs
010
Sandro Maglione @sandromaglione.bsky.social · 27/11/2024
Entity Component System (ECS) brings composability to game development 🪄 Split data and logic, and just compose entities with what they need to operate Clean, composable and powerful 🔥
050
Sandro Maglione @sandromaglione.bsky.social · 26/11/2024
Local-only calories tracker app project out now 🚀 Learn how to build a client-only app with database included in the browser with PGLite 🐘 @effect-ts.bsky.social + @drizzle.team + @tanstack.com router + XState www.typeonce.dev/course/calor...
typeonce.dev
Local-only calories tracker app | Typeonce
A local-only calories tracker app made with TanStack Router, PGlite, Effect, XState and drizzle. The app is all client-side, fast, private, and reactive using a local postgres database.
000
Sandro Maglione @sandromaglione.bsky.social · 25/11/2024
Functional programming in games? 🤨 I have been exploring a deep hole this week, and I may have found something Some ideas in this week newsletter 👇 www.sandromaglione.com/newsletter
010
Sandro Maglione @sandromaglione.bsky.social · 24/11/2024
New project landing next week Tuesday 26 November 🚀 Local-only calories tracker app 🏗️ @effect-ts.bsky.social ⚡️ @pglite.dev with live queries 📄 @drizzle.team 🔗 Actors with XState 🧱 @tanstack.com router Your next local-first stack 👇
1112
Sandro Maglione @sandromaglione.bsky.social · 23/11/2024
Upcoming local-only project is going to be an interesting one 🫡 Local database with @effect-ts.bsky.social schemas, migrations, XState state management, @tanstack.com router and more 🪄 Preview link: www.typeonce.dev/course/calor...
140
Sandro Maglione @sandromaglione.bsky.social · 23/11/2024
Add URL state to this and you have everything that you need 🤝
120
Sandro Maglione @sandromaglione.bsky.social · 22/11/2024
@tailwindcss.com v4 is out in beta 🚀 I have been using v4 for months now (early alpha) It empowers all my projects 🪄 No more js, configuration CSS only 🫡 Automatic source detection 💯 New custom utilities 🏗️ New custom variants And never came back 👇
020
Sandro Maglione @sandromaglione.bsky.social · 21/11/2024
New project coming: Local-only calories tracker app A key component of a local-first app is a local data store This is how to implement a local postgres database 👇 www.typeonce.dev/course/calor... @drizzle.team @pglite.dev @tailwindcss.com @vite.dev @tanstack.com @effect-ts.bsky.social
typeonce.dev
Local-only calories tracker app | Typeonce
A local-only calories tracker app made with TanStack Router, PGlite, Effect, XState and drizzle. The app is all client-side, fast, private, and reactive using a local postgres database.
2241
Sandro Maglione @sandromaglione.bsky.social · 21/11/2024
Introduce yourself with four video games 🕹️
010
Reposted by Sandro Maglione
Tanner Linsley @tannerlinsley.com · 19/11/2024
Stoked to announce that TanStack Start is now officially BETA! 🎉 🎊 Please come and try it and help us get it ready for 1.0! tanstack.com/start cc @tanstack.com
tanstack.com
TanStack Start
Full-document SSR, Streaming, Server Functions, bundling and more, powered by TanStack Router, Vinxi, and Nitro and ready to deploy to your favorite hosting provider.
3378595
Sandro Maglione @sandromaglione.bsky.social · 18/11/2024
The database is coming to the client 🔬 Exploring local first and databases on the browser with PGLite, @drizzle.team and @livestore.dev All in this week newsletter 👇 sandromaglione.com/newsletter
sandromaglione.com
On a mission to make you a better developer | Sandro Maglione
Timeless coding principles, practices, and tools that make a difference, regardless of your language or framework, delivered in your inbox every week.
031
Reposted by Sandro Maglione
Johannes Schickling @schickling.dev · 16/11/2024
Can't wait for next week! Getting ready for a big @expo.dev x @livestore.dev announcement!
0396
Sandro Maglione @sandromaglione.bsky.social · 14/11/2024
Experiments with database migrations in local app 🔬 Migrations generated using @drizzle.team, loaded from @vite.dev and applied to PGLite All inside initial @tanstack.com Router loader
020
Sandro Maglione @sandromaglione.bsky.social · 12/11/2024
The expressiveness and elegance of this API is glaring 🤩 👉 No need of explicit input using `flow` 👉 Type safe validation with `decode` 👉 Easy error handling with @EffectTS_ 👉 Type safe SQL query with PGLite and @DrizzleORM Abstraction and safety 🤙
020
Sandro Maglione @sandromaglione.bsky.social · 11/11/2024
Getting fancy with form validation 🪄 React Aria components + State management with XState + Validation with @effect-ts.bsky.social schema Full control and power 💯
020
Sandro Maglione @sandromaglione.bsky.social · 11/11/2024
My top 3 skills to learn as a software developer 1️⃣ SQL and relational databases 2️⃣ Domain modeling and data structures 3️⃣ Functional programming This is the topic of this week's newsletter, going over these in practice 👇 sandromaglione.com/newsletter
sandromaglione.com
On a mission to make you a better developer | Sandro Maglione
Timeless coding principles, practices, and tools that make a difference, regardless of your language or framework, delivered in your inbox every week.
020
Sandro Maglione @sandromaglione.bsky.social · 10/11/2024
Live queries with PGLite and @drizzle.team 👉 Compose query using drizzle 👉 `toSQL` to extract raw query and params Exactly what it's needed inside `useLiveQuery` to make PGLite live sync with db changes ⚡️
071
Sandro Maglione @sandromaglione.bsky.social · 09/11/2024
Wondering how to use Effect in your frontend client? As easy as it gets 🪄 Example of reading and writing into localStorage, all a single layer away 👇
010
Sandro Maglione @sandromaglione.bsky.social · 08/11/2024
Stripe payments in React with XState and Effect ☑️ Predictable using state machine ☑️ Error handling with Effect ☑️ Complete type-safety Full free code snippet 👇 www.typeonce.dev/snippet/stri...
typeonce.dev
Stripe payments React client with XState and Effect | Typeonce
Professional training for Full-Stack software development teams
010
Sandro Maglione @sandromaglione.bsky.social · 07/11/2024
Can't beat the simplicity of Effect error handling 🪄 Just yield a TaggedError to move the value in the error channel, or return a normal value at the end when successful 👇
020
Sandro Maglione @sandromaglione.bsky.social · 04/11/2024
Problems with cookies? 👀 Effect has them ready for you Declarative and type safe API to manage cookies baked and ready to consume 👨‍🍳
000
Sandro Maglione @sandromaglione.bsky.social · 04/11/2024
Loading environmental variables using dotenv? Effect solve this for you as well 🤝 No need to install dotenv at all, just use PlatformConfigProvider to extract env from a file 🪄
020
Sandro Maglione @sandromaglione.bsky.social · 04/11/2024
Ever heard of event sourcing? 🤔 It may be the solution to make real local-first possible Everything that I learned in this week newsletter 👇 sandromaglione.com/newsletter
sandromaglione.com
On a mission to make you a better developer | Sandro Maglione
Timeless coding principles, practices, and tools that make a difference, regardless of your language or framework, delivered in your inbox every week.
000
Sandro Maglione @sandromaglione.bsky.social · 02/11/2024
🦋🔗
030
Sandro Maglione @sandromaglione.bsky.social · 02/11/2024
Added dependencies version and link to repository for all snippets on Typeonce 💯 Libraries moves fast but the snippets are now all up to date github.com/typeonce-dev...
Screenshot of all the snippets on typeonce.dev
030
Sandro Maglione @sandromaglione.bsky.social · 01/11/2024
More accurate dependencies now on Typeonce courses 👀 Versions of languages and libraries are now displayed directly with the course Better than any updated date 🙌 www.typeonce.dev/course
010
Sandro Maglione @sandromaglione.bsky.social · 01/11/2024
Having fun writing script with Effect 💯 - Env variables with dotenv - File system with effect/platform - Access Github API with effect/platform - Complete validation with Schema
Script output showing logs of all the steps
020
Sandro Maglione @sandromaglione.bsky.social · 28/10/2024
What feels like play to you, but looks like work to others? If the answer is coding, it's the greatest era to be alive 🙌 How I went from coding as an hobby to turn it into a career, in this week newsletter 👇 sandromaglione.com/newsletter
sandromaglione.com
On a mission to make you a better developer | Sandro Maglione
Timeless coding principles, practices, and tools that make a difference, regardless of your language or framework, delivered in your inbox every week.
010
Sandro Maglione @sandromaglione.bsky.social · 27/10/2024
How do you order events in a local-first app? 🤔 An answer is Hybrid Logical Clocks (HLC) HLC allows synchronizing time in multiple nodes with a combination of physical clock and logical clock Keep track of time on separate devices without relying on a centralised clock or server coordination
000
Sandro Maglione @sandromaglione.bsky.social · 26/10/2024
Just moved to @nextjs.org 15 stable and Effect 3.10 Schema inside effect, new Effect Service API, async nextjs params Less lines of code 🤝
Merged PR showing all the commits with less lines of code with the new effect and nextjs upgrade
010