Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/vimode/frontend-mentor-challenges

🎯 Frontend Mentor Challenges are a way to showcase my ever growing web development skills. Each of my solution is a unique way to demonstrate my newly learned skills. Each challenge is provided with a design and style requirements to mimic a real-life workflow experience for a frontend developer.
https://github.com/vimode/frontend-mentor-challenges

frontend frontend-mentor-challenges fullstack fullstack-development leafletjs react react-redux react-router reactjs solved-challenges vanilla-js

Last synced: 5 days ago
JSON representation

🎯 Frontend Mentor Challenges are a way to showcase my ever growing web development skills. Each of my solution is a unique way to demonstrate my newly learned skills. Each challenge is provided with a design and style requirements to mimic a real-life workflow experience for a frontend developer.

Awesome Lists containing this project

README 

        
# Welcome! 👋



[Frontend Mentor](https://www.frontendmentor.io) challenges help you improve your coding skills by building realistic projects.



This repo is a single mega repo of all my submissions for the Frontend Mentor Challenges.

Challenges on FrontendMentor are categorised based on a difficulty level. So I am just using the same to categorise them for now.



This repo currently holds 58 projects. The earlier challenges are vanilla JS projects and the later ones are in SPA React Web Apps or Full Stack Web Apps with a NodeJS backend. I have titled them accordingly.



The goal of this challenge is to keep coding everyday even if the progress of the project is in small increments, learn and experiment new things along the way. I try to document my process, my difficulties and learnings from each project in the project's repo. I would appreciate any feedback you have for me.



## Difficulty Level



### Newbie (16)



- [Huddle landing page with single introductory section](/huddle-landing-page-with-single-introductory-section/)

- [Ping single column coming soon page](/ping-coming-soon-page/)

- [Single price grid component](/single-price-grid-component/)

- [Single price grid component Wide](/single-price-grid-component-wide/)

- [Intro component with sign-up form](/intro-component-with-signup-form/)

- [Base Apparel coming soon page](/base-apparel-coming-soon/)

- [Four card feature section](/four-card-feature-section/)

- [Coding bootcamp testimonials slider](/coding-bootcamp-testimonials-slider/)

- [Article preview component](/article-preview-component/)

- [Social proof section](/social-proof-section/)

- [FAQ accordion card](/faq-accordion-card/)

- [Profile card component](/profile-card-component/)

- [Pod request access landing page](/pod-request-access-landing-page/)

- [3-column preview card component](/3-column-preview-card-component/)

- [Meet landing page](/meet-landing-page/)

- [Stats preview card component](/stats-preview-card-component/)



### Junior(23)



- [Testimonials grid section](/testimonials-grid-section/)

- [Huddle landing page with curved sections](/huddle-landing-page-with-curved-sections/)

- [Fylo landing page with two column layout](/fylo-landing-page-with-two-column-layout/)

- [Pricing component with toggle](/pricing-component-with-toggle/)

- [Fylo data storage component](/fylo-data-storage-component/)

- [Fylo dark theme landing page](/fylo-dark-theme-landing-page/)

- [Project tracking intro component](/project-tracking-intro-component/)

- [Clipboard landing page](/clipboard-landing-page/)

- [Insure landing page](/insure-landing-page/)

- [Loopstudios landing page](/loopstudios-landing-page/)

- [Interactive pricing component](/interactive-pricing-component/)

- [Maker pre-launch landing page](/maker-pre-launch-landing-page/)

- [Social media dashboard with theme switcher](/social-media-dashboard-with-theme-switcher/)

- [Typemaster pre-launch landing page](/typemaster-pre-launch-landing-page/)

- [Sunnyside agency landing page](/sunnyside-agency-landing-page/)

- [Officelite Coming Soon Site](/officelite-coming-soon-site/)

- [Crowdfunding Product Page](/crowdfunding-product-page/)

- [Tip Calculator App](/tip-calculator-app/)

- [Huddle Landing page with alternating feature blocks](/huddle-landing-page-with-alternating-feature-blocks/)

- [Blogr landing page](/blogr-landing-page/)

- [Github User Search App](/github-user-search-app/)

- [Time Tracking Dashboard](/time-tracking-dashboard/)

- [Advice generator app(React)](/advice-generator-app-react/)



### Intermediate (16)



- [Bookmark landing page](/bookmark-landing-page/)

- [Launch Countdown Timer](/launch-countdown-timer/)

- [Manage Landing Page](/manage-landing-page/)

- [Creative Single Page Site](/creative-single-page-site/)

- [Clock App](/clock-app/)

- [Easybank Landing page](/easybank-landing-page/)

- [Room Homepage](/room-homepage/)

- [Github User Search App (React)](/github-user-search-app-v2/)

- [Job Listing with filtering (React)](/job-listings-with-filter-react/)

- [Planets Fact Side (React)](/planets-fact-site-react/)

- [Scoot Multipage Website (React)](/scoot-website-react/)

- [Intro Section with Dropdown Nav (React)](/intro-section-with-dropdown-navigation-react/)

- [IP Address Tracker(React)](/ip-address-tracker/)

- [Minimalist Portfolio website(React)](/minimalist-portfolio-website)

- [Todo App(Full Stack App)](/todo-app)

- [Dictionary Web App(React)](/dictionary-web-app)



### Advanced(2)



- [Multi-step form(React)](/multi-step-form)

- [Entertainment web app(Full Stack React App)](/entertainment-web-app)



### Guru(1)



- [Invoice App(Nextjs + MongoDb)](./invoice-app-v2/)



### Author



Discord vimo#6620



---



###### Pending tasks for the repo



- Filter projects to show selected few on the showcase page.

- Showcase page mobile icons and actions need to be distinct.