0% found this document useful (0 votes)
14 views4 pages

SkillPath Redesign

Uploaded by

Dota Nooby
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
14 views4 pages

SkillPath Redesign

Uploaded by

Dota Nooby
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
You are on page 1/ 4

SkillPath

 Framework:
- Next Js 14

 Main language:
- JavaScript / TypeScript

 Dependencies management
- Yarn

 Styles management
- Scss
- Styled-components

 UI Frameworks and Component Libraries:


- Material UI
- Ant Design

 State management:
- Redux-ToolKit

 Fetching libraries:
- Axios
- React-query

 Plugins:
- EsLint
- Prettier
- Husky and Lint-staged

 Form Handling:
- Redux

 Structure:
Framework:
Next.js 14:
A popular and highly recommended framework for building React applications, offering features
like server-side rendering (SSR) and static site generation (SSG). Provides an excellent
developer experience and optimization for performance and SEO.

Main Language:
JavaScript is a widely used language for web development, while TypeScript is a statically typed
superset of JavaScript. TypeScript can help catch type-related errors early and improve code
quality.

Dependencies Management:
Yarn is a package manager. Yarn is known for its speed and deterministic builds.
Styles Management:
SCSS:
A powerful and popular CSS preprocessor that allows you to use variables, nesting, and mixins
to write more maintainable styles.
Styled-components:
A CSS-in-JS library that lets you define component-specific styles using tagged template literals
in JavaScript that provides powerful styling capabilities and high performance.

UI Frameworks and Component Libraries:


Material UI:
 Material UI is a widely used and comprehensive UI framework for React that offers a
collection of reusable components with a Material Design look and feel. It follows
Google's Material Design guidelines, providing a clean and modern UI for web
applications.
 Key Features:
- Robust Component Library: Material UI offers a wide range of components, including
buttons, forms, navigation elements, and more.
- Theming and Customization: It supports theming and allows developers to customize
the appearance to match their project's branding.
- Responsive Design: Material UI components are designed to be mobile-responsive
and adaptable to various screen sizes.
- Accessibility: Accessibility is a top priority, making Material UI an accessible choice
for creating inclusive user interfaces.
 Usage: Material UI is commonly used in a variety of web applications, including admin
dashboards, e-commerce platforms, and consumer-facing websites.

Ant Design:
 Ant Design is a popular design system and UI library, developed by Alibaba, known for
its highly customizable, enterprise-grade components. It is designed with the goal of
creating efficient and consistent user interfaces for enterprise applications.

 Key Features:
- Enterprise-Ready: Ant Design focuses on providing components and design
patterns suitable for building enterprise-level applications.
- Extensive Component Library: It includes a vast collection of components like
tables, forms, modals, and more.
- Customization: Ant Design allows extensive customization through themes and
styles, making it easy to align with corporate branding.
- Documentation: Ant Design provides comprehensive documentation and best
practices to facilitate usage and customization.
 Usage: Ant Design is widely used in enterprise applications, including business
management tools, e-commerce platforms, and internal business systems.

States Management:
Redux Toolkit:
A set of tools and best practices for managing application state in a predictable and
maintainable way, often used in complex applications.

Fetching Libraries:
Axios: A widely used library for making HTTP requests, supporting REST and other APIs. Offers
flexibility and customization options.
React-Query: A library focused on data fetching and synchronization, with caching and
background data updates, ideal for providing a smooth user experience.

Plugins:
ESLint: A popular static code analysis tool for identifying and fixing problems in your code,
helping maintain code quality and consistency.
Prettier: An opinionated code formatter that ensures consistent code style and formatting across
your project.
Husky and Lint-staged: Tools to set up pre-commit and pre-push hooks for running ESLint and
Prettier to ensure code quality and consistency.

Form Handling:
Redux Toolkit:
A set of tools and best practices for managing application state in a predictable and
maintainable way, often used in complex applications.

You might also like