Create React App installation

Create your project

Start by creating your Create React App project if you don't have one already:

Or if you're using Typescript:

Install Reshaped

Download the latest Reshaped release from the Releases page and save the .tgz file into your project. Then install the package using the file path. For example, if you save the package as vendor/reshaped.tgz in the project root folder, you can run:

Start the application

Run your build process with npm run start.

Start using Reshaped components

Import some of the core components in src/App.tsx and try them out:

Add PostCSS config

By default, Create React App doesn't allow customizing the postcss.config.js file. Since Reshaped primarily uses vanilla CSS with CSS Modules, all features provided by Reshaped components work out of the box. All advanced features like responsive component properties syntax work with the default Create React App setup.

However, if you want to use Reshaped custom media query values, you can create and apply a custom postcss.config.js file either by ejecting Create React App or using tools like Craco. That will allow you to import a PostCSS config from Reshaped and add it to the postcss.config.js file in the root folder:

You can find more details in our cra-starter example on Github. If you want to learn more about components - search for the relevant components documentation in the sidebar.