SkillPath Redesign
SkillPath Redesign
Framework:
- Next Js 14
Main language:
- JavaScript / TypeScript
Dependencies management
- Yarn
Styles management
- Scss
- Styled-components
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.
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.