catherineisonline / frontend-mentor-challenge-solutions

Frontend Mentor: A showcase of my front-end skills. This collection features my solutions to various Frontend Mentor challenges, each providing a real-life workflow experience. From designs, assets, and style requirements, I have honed my skills in building responsive and visually appealing websites. Explore my solutions and see the live demos

Frontend Mentor Challenge Solutions

Frontend Mentor: A showcase of my front-end skills. This collection features my solutions to various Frontend Mentor challenges, each providing a real-life workflow experience. From designs, assets, and style requirements, I have honed my skills in building responsive and visually appealing websites. Explore my solutions and see the live demos

Project setup

npm install

Compiles and hot-reloads for development

npm run serve

Compiles and minifies for production

npm run build

In case of issues with gh-pages

• delete gh-branch if any

npm run build

git add dist && git commit -m "Initial dist subtree commit"

git subtree push --prefix dist origin gh-pages

Project List

Intro section with dropdown navigation

Live | Repo | Try Out

News homepage

Live | Repo | Try Out

Huddle landing page with alternating feature blocks

Live | Repo | Try Out

Crowdfunding product page

Live | Repo | Try Out

Fylo landing page with two column layout

Live | Repo | Try Out

Product preview card component

Live | Repo | Try Out

Calculator App

Live | Repo | Try Out

Interactive rating component

Live | Repo | Try Out

REST Countries API with color theme switcher

Live | Repo | Try Out

Fylo dark theme landing page

Live | Repo | Try Out

Sunnyside agency landing page

Live | Repo | Try Out

Pricing component with toggle

Live | Repo | Try Out

Intro component with sign-up form

Live | Repo | Try Out

Advice generator app

Live | Repo | Try Out

Base Apparel coming soon page

Live | Repo | Try Out

FAQ Accordion Card

Live | Repo | Try Out

Ping coming soon page

Live | Repo | Try Out

Article preview component

Live | Repo | Try Out

URL shortening API landing page

Live | Repo | Try Out

IP Address Tracker

Live | Repo | Try Out

Testimonials grid section

Live | Repo | Try Out

QR code component

Live | Repo | Try Out

Fylo data storage component

Live | Repo | Try Out

Huddle landing page with a single introductory section

Live | Repo | Try Out

NFT preview card component

Live | Repo | Try Out

Four card feature section

Live | Repo | Try Out

Social proof section

Live | Repo | Try Out

3-column preview card component

Live | Repo | Try Out

Single price grid component

Live | Repo | Try Out

Profile card component

Live | Repo | Try Out

Order summary component

Live | Repo | Try Out

Stats preview card component

Live | Repo | Try Out