A Create React App good starting point template to init a configured app with typescript, sass, eslint, prettier and more 💅
- ⚡ typescript
- ⚡ eslint
- ⚡ prettier
- ⚡ editor config
- ⚡ sass (Dart Sass package compiled to JS)
- ⚡ css reset
- ⚡ absolute imports
To use this template, add --template good-start
when creating a new app with create-react-app.
Note: if you are using Windows make sure to add the equality symbol between --template and good-start. example: --template=good-start
npx create-react-app my-app --template good-start
# OR
yarn create react-app my-app --template good-start
Then:
cd my-app
.
├── .editorconfig
├── .gitignore
├── .prettierrc
├── README.md
├── package.json
├── node_modules
├── public
│ └── index.html
├── src
│ ├── App.tsx
│ ├── components
│ │ └── Hello
│ │ ├── index.tsx
│ │ └── styles.module.sass
│ ├── index.tsx
│ ├── react-app-env.d.ts
│ └── styles
│ ├── colors.sass
│ ├── global.sass
│ └── reset.sass
├── tsconfig.json
└── yarn.lock
import Hello from 'components/Hello'
function App() {
return (
<section className="containers">
<Hello />
</section>
)
}
export default App
@use 'reset' as *
@use 'colors' as *
.containers
display: flex
flex-flow: column wrap
align-items: center
justify-content: center
padding: 0 2rem
background-color: $black
Contributions are always welcome.
There's a bunch of ways you can contribute to this project, like by:
- 🪲 Reporting a bug
- 🔌 Sending a Pull request (ask first, please)
- 📄 Improving this documentation
- 🚨 Sharing this project and recommending it to your friends
- 💵 Supporting this project on Patreon
- 🌟 Dropping a star on this repository