More Premium Hugo Themes Premium React Themes

Arc

React starter kit based on Atomic Design

Arc

React starter kit based on Atomic Design

Author Avatar Theme by diegohaz
Github Stars Github Stars: 2926
Last Commit Last Commit: Feb 16, 2021 -
First Commit Created: Apr 29, 2023 -
default image

Overview

ARc (Atomic React) is a React starter kit based on the Atomic Design methodology. It aims to organize and maintain large React projects by encouraging the use of small and pure components. The kit provides a basic stack with React, Webpack, react-router, and Jest, and offers additional branches with Redux, Redux-Saga, Redux-Form, and Server Side Rendering capabilities.

Features

  • Atomic Design Methodology: ARc follows the Atomic Design methodology, which emphasizes creating reusable components through composition. This helps to keep the project organized and maintainable as it grows.
  • Progressive Development: ARc provides a basic boilerplate that allows developers to start with the essentials and gradually incorporate additional features as needed. This allows for flexibility and ease of adoption.
  • Component Organization: With ARc, components can be organized based on their domain or shared functionality. This helps to avoid a large and complex components folder, making it easier to manage and maintain.

Installation

To install ARc and get started with your React project, follow these steps:

  1. Clone the ARc source code by cloning one of the ARc branches.

    git clone [ARc branch URL]
    
  2. (Optional) If you want to start with a clean repository, remove the ARc git history and initialize a new repository.

    cd [ARc directory]
    rm -rf .git
    git init
    
  3. Install the project dependencies.

    npm install
    
  4. Run the app to start the development server with Hot Module Replacement (HMR).

    npm start
    
  5. Open http://localhost:3000 in your browser to access the development server.

For Redux-SSR branches, an additional Webpack assets server will be available at http://localhost:3001.

Summary

ARc is a React starter kit that follows the Atomic Design methodology, which provides a systematic approach to organizing and maintaining large React projects. By encouraging the use of small and pure components and offering additional features like Redux integration and Server Side Rendering, ARc aims to make web development with React more efficient and enjoyable. With its progressive development approach, developers can start with a basic boilerplate and gradually incorporate more advanced features as needed. Overall, ARc provides a solid foundation for building scalable and maintainable React applications.