Technologies

These are the technologies I used across my Frontend Mentor challenges:

Framework

Next.js

React framework for building full-stack web applications

Markup and Styling

HTML

Markup language for documents displayed in a web browser

CSS

Specifies the presentation/styling of a document written in a markup language

Tailwind CSS

CSS framework allows to build custom designs without leaving the HTML

Programming Language

Typescript

Strongly typed PL that builds on JavaScript, giving better tooling at any scale

Runtime

Node.js

Cross-platform JS runtime environment that lets developers create servers, web apps, command line tools and scripts

Libraries

React

JavaScript library for web and native UIs

React Hook Form

Helps build performant, flexible and extensible forms with easy-to-use validation

Clsx

Utility for constructing className strings conditionally

focus-trap-react

React component that traps focus

React Icons

Bundles popular icon sets as React components

Hero Icons

SVG icons by the makers of Tailwind CSS

State Management

Redux Toolkit

manage global app state with Redux, with less boilerplate.

Developer Tools

React Developer Tools

Extension for inspecting the React component tree and debugging props and state

Redux Developer Tools

Extension for tracking Redux state changes and replaying actions during debugging

Lighthouse

Creates audits for performance, accessibility, progressive web apps, SEO, and more.

Testing Frameworks and Libraries

Jest

JavaScript testing framework

React Testing Library

React components testing library

Playwright

Automation library for E2E testing

Accessibility

NVDA

Open-source screen reader for Windows

Version control and CI/CD

Git Hub

Version control system for tracking code changes and managing project history

Git Hub Actions

CI/CD platform built into GitHub that automates workflows on every push or pull request

Design

Figma

UI design and prototyping tool used to create wireframes, mockups, and design systems collaboratively