Practice Website

Note: All code in this repository is written by me as part of my learning process. I use AI/LLM tools for guidance and explanations, but I write and type every line of code myself to build genuine understanding of each language.

HTML

• Practice HTML — A practice HTML page from my freeCodeCamp learning.
• Ship Bottom NJ Project — Practice embedding MP4 video using Cloudinary.
• Yoga Retreats — Practice semantic HTML elements.
• Book Catalog Table — Practice building HTML tables using a curated list of architecture and design books.
• Mobile App UX Survey Form — Practice building HTML forms with inputs, dropdowns, radio buttons, and checkboxes.
• Checkout Page — Practice building a checkout page with accessible form inputs and payment fields.
• Movie Review — Practice HTML structure using images, lists, and semantic markup.
• Multimedia Player — Practice embedding audio and video with captions and accessibility attributes.

CSS

• Business Card — Practice CSS styling including selectors, colors, typography, borders, spacing, and linking an external stylesheet.
• Stylized To-Do List — Practice CSS pseudo-classes for link states including hover, focus, active, and visited.
• Blog Post Card — Practice CSS backgrounds, borders, border-radius, box-shadow, and hover effects.
• Event Flyer Page — Practice CSS layout using flexbox, viewport units, and the calc function.
• Job Application Form — Practice CSS pseudo-classes including focus, valid, invalid, checked, hover, and first-of-type.
• Boho Colored Boxes — Practice CSS color formats including hexadecimal, RGB, HSL, and predefined color values.
• Contact Form — Practice CSS form styling including border-radius, padding, hover effects, and label formatting.
• Feature Selection Page — Practice CSS custom checkboxes, pseudo-elements, the :has() selector, and flexbox card layouts.
• Pricing Plans Layout — Practice CSS flexbox layout including flex-wrap, flex-grow, order, flex shorthand, and transform hover effects.
• Page of Playing Cards — Practice CSS flexbox alignment including align-self, flex-direction, transform rotation, and hover effects.
• Newspaper Article — Practice CSS typography including rem, em units, text-transform, font-weight, font-style, and the ::first-letter pseudo-element.
• Tribute Page — Practice CSS layout and styling while building a tribute page for Grace Hopper, pioneer of computer programming.
• Newspaper Layout — Practice CSS Grid layout including grid-template-areas, grid-template-columns, grid-template-rows, and grid-area properties.
• Product Landing Page — Practice CSS fixed navbar, flexbox layout, media queries, and responsive design while building a product landing page for the Donner DDP-80 piano series.
• Technical Documentation Page — Practice CSS fixed sidebar layout, media queries, and responsive design while building a technical documentation page on Architecture and Design Systems.
• Book Inventory — Practice CSS attribute selectors including exact match, word match, starts-with, and contains selectors applied to a styled table layout.
• House Painting — Practice CSS positioning including absolute, relative, and fixed positioning to build a house scene with brick patterns, window frames, and landscape.
• Availability Table — Practice CSS variables, custom properties in :root, linear gradients with hard stops, and alternating border styles using variable references.
• Moon Orbit — Practice CSS animations using @keyframes, transform with rotate and translate, and radial gradients to create a moon orbiting Earth in space.
• Portfolio Page — Practice CSS fixed navbar, grid layout, hover effects with pseudo-elements, and responsive design while building a personal portfolio page.