📅 Thursday — July 24, 2025
💻 Day 207 of non-stop coding!
🛠 JavaScript + The Odin Project progress
📖 2 articles read
📌 Trello & public updates complete

#Beyond365DaysOfCode #100DaysOfCode #JavaScript #TheOdinProject #WebDevJourney #LearnWebDev #CodingDaily #BuildInPublic

Web design and Web development courses

Unlock your digital future with NextGen2AI’s expert-led courses in web design and development. Learn UI/UX, coding, and real-world tools to build stunning, responsive websites. Start building today!

Contact us for more Info:
Mob No.: +91-9337021430
Mail Id: mail@nextgen2ai.com
Explore more Info: http://nextgen2ai.com/portfolio.html

#LearnWebDev #NextGen2AI #WebDesignCourses #FutureTechSkills

🧧 Unleash the power of Scroll-Driven Animations
by @bramus
at Chrome for Developers

Video Series
#css #ScrollDriven #Animation #webdev #LearnWebDev

https://www.youtube.com/playlist?list=PLNYkxOF6rcICM3ttukz9x5LCNOHfWBVnn

🪐 HTML is for people

by Blake Watson @bw

This book is aimed at people who have no prior coding experience of any kind.

#html #webdev #LearnHTML #LearnWebDev

https://htmlforpeople.com/

#100DaysOfCode

#Day52 : building a Todo with @sveltejs #Svelte and @vite #vite

- using bind: to handle user input and dispath the event
- using props to activate function and change states of the component
- conditionnaly style with a CSS class activated only when a prop is true

Source Code : https://github.com/teotimepacreau/Svelte-Vite-Todo

#WebDev
#Frontend
#LearnWebDev
#Javascript
#LearnToCode
#LearnJavascript
#JS
#HTML
#CSS
#UI
#VanillaJS

#100DaysOfCode

#Day51 : learning #Svelte @sveltejs
- dispatching events
- working with components
- reactivity
- props

Source Code : https://github.com/teotimepacreau/Learn-Svelte

#WebDev
#Frontend
#LearnWebDev
#Javascript
#LearnToCode
#LearnJavascript
#JS
#HTML
#CSS
#UI
#VanillaJS

#100DaysOfCode

#Day50 : continue Bookshelf project
- implemented reservation function, clicking on a book card button "reserve", adds the book to the reservation modal `<dialog>`
- deployed #Fastify #SQLite backend to fly.io @flydotio
- deployed #Vite frontend @vercel

https://bookshelf.teotimepacreau.fr/

Source Code : https://github.com/teotimepacreau/bookshelf

@fastify

#WebDev #Frontend #LearnWebDev #Javascript #LearnToCode #LearnJavascript #JS #HTML #CSS #UI #VanillaJS

#100DaysOfCode

#Day49 : continue Bookshelf project
- implemented View Transitions API fade animation when changing page
- implemented Scroll-Progress-Timeline to animate with CSS only the elements entry on scroll using `animation: book-entry linear forwards; animation-timeline: view(); animation-range: entry 0% 35%;`

Source Code : https://github.com/teotimepacreau/bookshelf

@fastify
#WebDev #Frontend #LearnWebDev #Javascript #LearnToCode #LearnJavascript #JS #HTML #CSS #Vite #Fastify #UI #VanillaJS

#100DaysOfCode

#Day48 : continue Bookshelf project
- Authorization : only authenticated user that have a session-cookie can add a book to the collection and the SQL DB
- Adding book to the collection : when addBookForm is received it visually adds, and adds to the DB
- At reload : it combines "goodreads" & "bookviaform" table

Source Code : https://github.com/teotimepacreau/bookshelf

@fastify

#WebDev #Frontend #LearnWebDev #Javascript #LearnToCode #LearnJavascript #JS #HTML #CSS #Vite #Fastify #UI #VanillaJS

#100DaysOfCode

#Day47 : continuing Bookshelf project
- Login function : <dialog> element contains the connexion form. username and password are passed to the backend endpoint "/login"
- Authentification : Retrieving username and password. Hashing it through bcrypt. Fastify-secure-session plugin adds a session cookie.

Source Code : https://github.com/teotimepacreau/bookshelf

@fastify

#WebDev #frontend #LearnWebDev
#Javascript #LearnToCode
#LearnJavascript #JS #HTML #CSS #Vite #Fastify #UI #VanillaJS