#viewtransitionsapi — Public Fediverse posts

#100DaysOfCode : #VanillaJS

#Day37 : Table with dynamic pagination

Online demo : https://teotimepacreau.github.io/Table-with-dynamic-pagination-Day37-of-100-DaysOfCode/

Source Code : https://github.com/teotimepacreau/Table-with-dynamic-pagination-Day37-of-100-DaysOfCode

Learned :
- pushing in an array each rows until a number of rowsPerPage with a for(i=0; i<arrayOfRows.length; i=i+rowsPerPage)
- implemented ViewTransitions API
- active page styled
- tried to implement a sorter but non complete

#WebDev #Frontend #CSS #WebDesign #LearnWebDev #Javascript #LearnToCode #LearnJavascript #JS #ViewTransitionsAPI

#100DaysOfCode : #HTML #CSS #VanillaJS

#Day20 : Bookmark reader using only Raindrop.io API

Inspired by the excellent design and functionality from @iamrobin https://www.iamrob.in/bookmarks

Online demo :
https://teotimepacreau.github.io/Bookmark-reader-using-Raindrop-API-Day20-of-100DaysOfCode/

Source Code : https://github.com/teotimepacreau/Bookmark-reader-using-Raindrop-API-Day20-of-100DaysOfCode
Project goals ↓
#WebDev #Frontend #WebDesign #LearnWebDev #Javascript #LearnToCode #CodingDay #FrontendDevelopment #UIDesign #UITrend #DailyUI #CodingChallenge #LearnCode #WebDevelopment #LearnJavascript #JS #DailyUI #ViewTransitionsAPI

#100DaysOfCode : #HTML #CSS #VanillaJS

#Day20 : Bookmark reader using only Raindrop.io API

Inspired by the excellent design and functionality from @iamrobin https://www.iamrob.in/bookmarks

Online demo :
https://teotimepacreau.github.io/Bookmark-reader-using-Raindrop-API-Day20-of-100DaysOfCode/

Source Code : https://github.com/teotimepacreau/Bookmark-reader-using-Raindrop-API-Day20-of-100DaysOfCode
Project goals ↓
#WebDev #Frontend #WebDesign #LearnWebDev #Javascript #LearnToCode #CodingDay #FrontendDevelopment #UIDesign #UITrend #DailyUI #CodingChallenge #LearnCode #WebDevelopment #LearnJavascript #JS #DailyUI #ViewTransitionsAPI

#100DaysOfCode : #HTML #CSS

#Day11 : View Transitions API for MPA

Online demo :
https://teotimepacreau.github.io/View-Transitions-API-for-MPA-Day11-of-100DaysOfCode/

Source Code : https://github.com/teotimepacreau/View-Transitions-API-for-MPA-Day11-of-100DaysOfCode

Project goals :
- HTML meta tags on both pages to unlock transitions API without JS
- Transition composed by opacity, left and transform scale

#WebDev #Frontend #WebDesign #CodingChallenge #Javascript #LearnToCode #CodingDay #FrontendDevelopment #WebDevelopment #UIDesign #UITrend #CodingChallenge #LearnCode #LearningDaily #ViewTransitionsAPI