Baptiste Debree @Bat_coder

Web developer Front-End • Guitarist/Bassist • Running addict • Father of Cats 🐈‍⬛🐈‍⬛ Paris, France Joined June 2022

Tweets

39
Followers

13
Following

155
Likes

210

Baptiste Debree @Bat_coder

a month ago

@brunostasse @silk_hq 👏🏻 well done Bruno

1 0 1 357 0

View Details

Bruno Stasse @brunostasse

a month ago

ChatGPT’s mobile web app uses @silk_hq for its bottom sheets. Silk is now powering native-like interactions inside one of the most-used products in the world 🎉

22 9 335 40K 269

View Details

Una 🇺🇦 @Una

2 months ago

Great post on scroll-driven animation from the web animations master himself, @JoshWComeau joshwcomeau.com/animation/scro…

3 25 190 9K 124

View Details

Bruno Stasse @brunostasse

2 months ago

Lovable's bottom sheets are built with @silk_hq. On the web and in the app. Same code. Native feel everywhere.

Lovable @Lovable

2 months ago

Introducing the Lovable mobile app. Your ideas won’t wait. Now you can build them anywhere.

173 120 1K 380K 333

9 4 163 27K 160

View Details

Bruno Stasse @brunostasse

2 months ago

The new docs for @silk_hq are now live on the website. Every page is available in Markdown, with an llms.txt to guide AI tools. More information on the "Usage with AI Tools" page. Link below 👇

2 2 12 662 2

View Details

Bruno Stasse @brunostasse

a year ago

Simple swipeable page on the web, made with @silk_hq

1 2 52 3K 15

View Details

Bruno Stasse @brunostasse

a year ago

Detached sheet made with @silk_hq on the web. Natural overshoot, status bar blending with the backdrop, swipe or click outside to dismiss.

0 2 15 1K 4

View Details

`<Sheet.View>` is Silk's most important sub-component. It defines the area where the sheet is visible, but it's also where you set most of its configuration. It has props for content placement, detents, swipe behavior, interactions outside, and a lot more.

0 2 6 2K 2

View Details

Bruno Stasse @brunostasse

a year ago

This move by the DOJ is bad news for the web. Google is singlehandedly founding up to two-thirds of browser engine development (Chromium & Gecko) at the moment. Cut that off and the platform will likely stagnate and slowly become irrelevant...

Open Web Advocacy @OpenWebAdvocacy

a year ago

🚨 NEW: The DOJ wants to break up Chrome from Google — the consequences could be catastrophic for the web. 📖 Read our article: Break Google's search monopoly without breaking the web. 👇Link below /1

8 14 38 18K 9

1 2 4 2K 0

View Details

Open Web Advocacy @OpenWebAdvocacy

a year ago

8 14 38 18K 9

View Details

Bruno Stasse @brunostasse

a year ago

Just released Silk v0.9.0, which improves compatibility with Tailwind v4 and some build tools! Silk's CSS styles are now exported from the package, letting you import them as you need in your project.

3 3 63 5K 10

View Details

Bruno Stasse @brunostasse

a year ago

Bottom sheets are great, but what about top sheets? Swipeable. 120fps. On the web. Made with Silk.

0 5 47 4K 15

View Details

Bruno Stasse @brunostasse

a year ago

In Silk, the `ˋ sub-component acts like an umbrella that gathers and links together the other sub-components. It holds the states and data that needs to be shared among them. For example, it is where are set the ˋpresented` and ˋonPresentedChange` props, which allow you to make the sheet a controlled component.

1 2 13 1K 1

View Details

Bruno Stasse @brunostasse

a year ago

Swipeable music player. Made with Silk, on the web.

8 6 157 10K 43

View Details

Bruno Stasse @brunostasse

a year ago

Silk is low-level and unstyled by default. The examples are just a starting point to help you move fast—but you're not limited to them. It's highly flexible and designed to let you build whatever swipeable (or not) sheet UI you may need. Go wild with it.

1 3 18 2K 4

View Details

Bruno Stasse @brunostasse

a year ago

Here's the code it takes to create a bottom sheet with Silk. Its declarative API, based on sub-components, aims to cover the most common use cases out of the box. When needed, you can opt into more imperative methods to make your sheet controlled.

3 5 69 6K 19

View Details

Bruno Stasse @brunostasse

a year ago

I built Silk to feel right on both mobile and desktop. You can swipe sheets with your trackpad, just like switching workspaces or going back in the browser. If you’ve got a mouse, the scroll wheel works too. Or just click the backdrop or close button. No mouse? Hit escape.

13 13 271 22K 168

View Details

Bruno Stasse @brunostasse

a year ago

To make Silk more accessible to indie hackers and early-stage startups, I am introducing a new €299 tier for businesses with 1 to 5 employees. I also plan to introduce purchasing power parity pricing in the future to ensure Silk is affordable in lower-income countries. Excited to see what you all build with Silk!

11 3 70 8K 15

View Details

Bruno Stasse @brunostasse

a year ago

Since last week, I have added a "Usage" section to Silk's docs to help integrate it with other tools. It currently has four pages: • Usage with Vite & Next.js with Pages router: These environments don't import global CSS automatically from packages. Their configuration needs to be tweaked a bit to allow it. • Usage with Tailwind V4: In that version, Tailwind wraps its styles into CSS ˋ@layer` which can conflict with Silk's (very few) default styles. • Usage with AI tools: Providing guidance on how to feed Silk's docs to your AI tools. Let me know if you struggle to integrate it into your workflow.

0 2 12 1K 1

View Details

Bruno Stasse @brunostasse

a year ago

Silk relies heavily on web APIs, like Scroll snap and WAAPI. While building it, I also took care to anticipate new ones, like the Scroll-driven animations API. For each feature, I reviewed and experimented with the existing APIs to see how well they fit. I also had a look at upcoming ones, and sometimes took part in the conversation to try and improve them before they shipped—like I just did with the interactivity CSS property. Every time, I tried several solutions, sometimes deciding to go with web APIs, sometimes holding off because I realised they were not yet ready, like