Building a Portfolio Layout with HTML, CSS & JSON | Project Part 2

In this live stream I continue building the Practice Layouts homepage, a blog-style portfolio for the projects I build and deploy on the channel. This part is mostly about thinking through the structure before the JavaScript: what belongs in the local JSON file, what links each project needs, how much social sharing makes sense and how to set up the HTML so the page has a good foundation. I also start the CSS setup with fonts, colors, global styles, accessible hiding utilities and early decisions around project links and video embeds. This is for frontend developers who want to see the real planning work behind a vanilla HTML, CSS and JavaScript project, not just the polished final version. Topics covered: Structuring local JSON for a static project portfolio Choosing project fields like title, category, date, links and YouTube IDs Deciding between useful links and unnecessary social sharing controls Adding markup for project links and click-to-load videos Setting up fonts, colors, global CSS and accessibility helpers Subscribe if you want more real-time frontend practice with vanilla HTML, CSS and JavaScript. #html #css #javascript 🟣 REPO: https://github.com/angelajholden/prac... 🔵 CODE REVIEWS: https://angelajholden.com/consulting 🔵 EMAIL: [email protected] 🟢 SPONSOR: https://github.com/sponsors/angelajho... 🟢 DONATE: https://www.paypal.me/angelajholden 📚 Chapters 00:00:00 Starting Soon 00:02:41 Intro and project context 00:03:54 Recapping the Practice Layouts homepage 00:10:38 Planning the local JSON structure 00:21:22 Deciding whether local data needs IDs 00:32:26 Adding project links and link semantics 00:38:50 Rethinking social sharing buttons 00:50:05 Markup for click-to-load video embeds 00:59:17 CSS setup and Normalize 01:02:58 Choosing fonts for the layout 01:11:59 Accessible color decisions 01:23:25 Global styles and utility classes 01:40:55 Wrap-up and next steps