Ecosyste.ms: Awesome

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

Awesome Lists | Featured Topics | Projects

https://github.com/n0rrman/frontend-mentor-challenges-blue

A mono repository for my solutions to the blue Frontend Mentor challenges. The challenges are solved using Next.js, Tailwind CSS, and TypeScript.
https://github.com/n0rrman/frontend-mentor-challenges-blue

frontend-mentor frontendmentor-challenge nextjs tailwindcss typescript

Last synced: 16 days ago
JSON representation

A mono repository for my solutions to the blue Frontend Mentor challenges. The challenges are solved using Next.js, Tailwind CSS, and TypeScript.

Awesome Lists containing this project

README

        

# Frontend Mentor Challenges - Blue

A mono repository for my solutions to the 🔵Newbie [Frontend Mentor](https://www.frontendmentor.io/challenges) challenges. All submitted solutions are also available [here](https://www.frontendmentor.io/profile/n0rrman/solutions), on my Frontend Mentor profile.

The challenges are solved using [Next.js](https://nextjs.org/) or [Angular](https://angular.dev), [Tailwind CSS](https://tailwindcss.com/), and [TypeScript](https://www.typescriptlang.org).

---

| Challenge | Level | Repository | Live version | Framework | Screenshot |
|-----------|-------|------------|--------------|-|-----------|
| [QR code component](https://www.frontendmentor.io/solutions/qr-code-component-tailwind-and-nextjs-wccBAtTkIf) | 🔵Newbie | [qr-code-component](https://github.com/n0rrman/frontend-mentor-challenges-blue/tree/main/qr-code-component) | [Vercel](https://qr-code-component-chi-five.vercel.app) | NextJS & TailwindCSS | ![Screenshot of the solved QR code component challeng](qr-code-component/design/screenshot.png) |
| [Product preview card component](https://www.frontendmentor.io/solutions/product-preview-card-component-tailwind-and-nextjs-tvwoiGreHb) | 🔵Newbie | [product-preview-card-component](https://github.com/n0rrman/frontend-mentor-challenges-blue/tree/main/product-preview-card-component) | [Vercel](https://product-preview-card-component-seven-sand.vercel.app) | NextJS & TailwindCSS | ![Screenshot of the solved product preview code component challenge](product-preview-card-component/design/screenshot.png) |
| [Stats preview card component](https://www.frontendmentor.io/solutions/stats-preview-card-component-tailwind-and-nextjs-AAk4hxm-v7) | 🔵Newbie | [stats-preview-card-component](https://github.com/n0rrman/frontend-mentor-challenges-blue/tree/main/stats-preview-card-component) | [Vercel](https://stats-preview-card-component-beta-olive.vercel.app) | NextJS & TailwindCSS | ![Screenshot of the solved stats preview card component challenge](stats-preview-card-component/design/screenshot.png) |
| [NFT preview card component](https://www.frontendmentor.io/solutions/nft-preview-card-component-tailwind-and-nextjs--cQVwO_tGa) | 🔵Newbie | [nft-preview-card-component](https://github.com/n0rrman/frontend-mentor-challenges-blue/tree/main/nft-preview-card-component) | [Vercel](https://nft-preview-card-component-kappa-navy.vercel.app) | NextJS & TailwindCSS | ![Screenshot of the solved NFT preview card component challenge](nft-preview-card-component/design/screenshot.png) |
| [Results summary component](https://www.frontendmentor.io/solutions/results-summary-component-solution-tailwind-and-nextjs-vdul_gXT6T) | 🔵Newbie | [results-summary-component](https://github.com/n0rrman/frontend-mentor-challenges-blue/tree/main/results-summary-component) | [Vercel](https://results-summary-component-delta-amber.vercel.app) | NextJS & TailwindCSS | ![Screenshot of the solved result summary component challenge](results-summary-component/design/screenshot.png) |
| [Profile card component](https://www.frontendmentor.io/solutions/profile-card-component-tailwind-and-nextjs-8-6Lbm-WTc) | 🔵Newbie | [profile-card-component](https://github.com/n0rrman/frontend-mentor-challenges-blue/tree/main/profile-card-component) | [Vercel](https://profile-card-component-nine-bice.vercel.app/) | NextJS & TailwindCSS | ![Screenshot of the solved profile card component challenge](profile-card-component/design/screenshot.png) |
| [Order summary card component](https://www.frontendmentor.io/solutions/order-summary-card-tailwind-and-nextjs-xzpWPj9yhl) | 🔵Newbie | [order-summary-component](https://github.com/n0rrman/frontend-mentor-challenges-blue/tree/main/order-summary-component) | [Vercel](https://order-summary-component-ivory.vercel.app) | NextJS & TailwindCSS | ![Screenshot of the solved order summary component challenge](order-summary-component/design/screenshot.png) |
| [3-column preview card component](https://www.frontendmentor.io/solutions/3column-preview-card-component-tailwind-and-nextjs-Dvzw-nUeth) | 🔵Newbie | [3-column-preview-card-component](https://github.com/n0rrman/frontend-mentor-challenges-blue/tree/main/3-column-preview-card-component) | [Vercel](https://3-column-preview-card-component-ochre.vercel.app) | NextJS & TailwindCSS | ![Screenshot of the solved 3-column preview card challenge](3-column-preview-card-component/design/screenshot.png) |
| [Single price grid component](https://www.frontendmentor.io/solutions/single-price-grid-component-tailwind-and-nextjs-2UUTwWXLEb) | 🔵Newbie | [single-price-grid-component](https://github.com/n0rrman/frontend-mentor-challenges-blue/tree/main/single-price-grid-component) | [Vercel](https://single-price-grid-component-nu-orpin.vercel.app) | NextJS & TailwindCSS | ![Screenshot of the solved single price grid challenge](single-price-grid-component/design/screenshot.png) |
| [Four card feature section](https://www.frontendmentor.io/solutions/four-card-feature-section-tailwind-and-nextjs-L61hyCEEkk) | 🔵Newbie | [four-card-feature-section](https://github.com/n0rrman/frontend-mentor-challenges-blue/tree/main/four-card-feature-section) | [Vercel](https://four-card-feature-section-eta-lemon.vercel.app/) | NextJS & TailwindCSS | ![Screenshot of the solved challenge](four-card-feature-section/design/screenshot.png) |
| [Huddle landing page with a single introductory section](https://www.frontendmentor.io/solutions/huddle-landing-page-with-a-single-introductory-section-tailwind-nfp7c9rUkW) | 🔵Newbie | [huddle-landing-page-with-single-introductory-section](https://github.com/n0rrman/frontend-mentor-challenges-blue/tree/main/huddle-landing-page-with-single-introductory-section) | [Vercel](https://huddle-landing-page-with-single-introductory-section-liart.vercel.app) | NextJS & TailwindCSS | ![Screenshot of the solved challenge](huddle-landing-page-with-single-introductory-section/design/screenshot.png) |
| [Social proof section](https://www.frontendmentor.io/solutions/social-proof-section-tailwind-and-nextjs-WKoXN0pcYG) | 🔵Newbie | [social-proof-section](https://github.com/n0rrman/frontend-mentor-challenges-blue/tree/main/social-proof-section) | [Vercel](https://social-proof-section-livid-five.vercel.app/) | NextJS & TailwindCSS | ![Screenshot of the solved challenge](social-proof-section/design/screenshot.png) |
| [Interactive rating component](https://www.frontendmentor.io/solutions/interactive-rating-component-tailwind-and-nextjs-sH2V9JEZwr) | 🔵Newbie | [interactive-rating-component](https://github.com/n0rrman/frontend-mentor-challenges-blue/tree/main/interactive-rating-component) | [Vercel](https://interactive-rating-component-eta-silk.vercel.app) | NextJS & TailwindCSS | ![Screenshot of the solved challenge](interactive-rating-component/design/screenshot.png) |
| [Blog preview card](https://www.frontendmentor.io/solutions/blog-preview-card-tailwind-and-nextjs-J3e_er_XDl) | 🔵Newbie | [blog-preview-card](https://github.com/n0rrman/frontend-mentor-challenges-blue/tree/main/blog-preview-card) | [Vercel](https://blog-preview-card-swart.vercel.app/) | NextJS & TailwindCSS | ![Screenshot of the solved challenge](blog-preview-card/design/screenshot.png) |
| [Ping single column coming soon page](https://www.frontendmentor.io/solutions/ping-single-column-coming-soon-page-tailwind-and-nextjs-Ml7sbSs8Rx) | 🔵Newbie | [ping-coming-soon-page](https://github.com/n0rrman/frontend-mentor-challenges-blue/tree/main/ping-coming-soon-page) | [Vercel](https://ping-coming-soon-page-chi-fawn.vercel.app/) | NextJS & TailwindCSS | ![Screenshot of the solved challenge](ping-coming-soon-page/design/screenshot.png) |
| [FAQ accordian](https://www.frontendmentor.io/solutions/faq-accordian-tailwindcss-and-nextjs-YhJa-kVYFx) | 🔵Newbie | [faq-accordion](https://github.com/n0rrman/frontend-mentor-challenges-blue/tree/main/faq-accordion) | [Vercel](https://faq-accordion-ashen.vercel.app) | NextJS & TailwindCSS | ![Screenshot of the solved challenge](faq-accordion/design/screenshot.png) |
| [Intro component with sign-up form](https://www.frontendmentor.io/solutions/intro-component-with-signup-form-tailwindcss-and-nextjs-BF4iJFdwC5) | 🔵Newbie | [intro-component-with-signup-form](https://github.com/n0rrman/frontend-mentor-challenges-blue/tree/main/intro-component-with-signup-form) | [Vercel](https://intro-component-with-signup-form-tau-self.vercel.app) | NextJS & TailwindCSS | ![Screenshot of the solved challenge](intro-component-with-signup-form/design/screenshot.png) |
| [Social links profile](https://www.frontendmentor.io/solutions/social-links-profile-tailwindcss-and-nextjs-UF1CrA0nVh) | 🔵Newbie | [social-links-profile](https://github.com/n0rrman/frontend-mentor-challenges-blue/tree/main/social-links-profile) | [Vercel](https://social-links-profile-lyart.vercel.app) | NextJS & TailwindCSS | ![Screenshot of the solved challenge](social-links-profile/design/screenshot.png) |
| [Article preview component](https://www.frontendmentor.io/solutions/article-preview-component-tailwind-and-nextjs-RWaOspw2Qy) | 🔵Newbie | [article-preview-component](https://github.com/n0rrman/frontend-mentor-challenges-blue/tree/main/article-preview-component) | [Vercel](https://article-preview-component-tawny-chi.vercel.app) | NextJS & TailwindCSS | ![Screenshot of the solved challenge](article-preview-component/design/screenshot.png) |
| [Recipe Page](https://www.frontendmentor.io/solutions/recipe-page-tailwind-and-nextjs-sU3nIsZT8A) | 🔵Newbie | [recipe-page](https://github.com/n0rrman/frontend-mentor-challenges-blue/tree/main/recipe-page) | [Vercel](https://recipe-page-ashen.vercel.app) | NextJS & TailwindCSS | ![Screenshot of the solved challenge](recipe-page/design/screenshot.png) |
| [Base Apparel coming soon page](https://www.frontendmentor.io/solutions/base-apparel-coming-soon-page-tailwind-and-nextjs-42d5JTlXWm) | 🔵Newbie | [base-apparel-coming-soon](https://github.com/n0rrman/frontend-mentor-challenges-blue/tree/main/base-apparel-coming-soon) | [Vercel](https://base-apparel-coming-soon-three-bice.vercel.app) | NextJS & TailwindCSS | ![Screenshot of the solved challenge](base-apparel-coming-soon/design/screenshot.png) |