Initialize project

In this part you'll learn how to create new app with stocked

Create React App

Let's create a new project using create-react-app utility. Run this command in your terminal

npm

npx create-react-app my-app

yarn

yarn create react-app my-app

Pro tip!

If you want to use typescript in your project, specify one more flag to the create-react-app: --template typescript.

Install dependencies

To install latest stocked stable version, run this command:

npm

npm install stocked

yarn

yarn add stocked

Create app state

JavaScript

Delete everything from your ./src/App.jsx and wrap your app content with StockRoot component:

./src/App.jsx

import { StockRoot } from 'stocked';

function App() {
    return (
        <StockRoot initialValues={{}}>
            <h1>Todo list!</h1>
        </StockRoot>
    );
}

export default App;

TypeScript

Delete everything from your ./src/App.tsx and wrap your app content with StockRoot component:

./src/App.tsx

import { StockRoot } from 'stocked';

function App() {
    return (
        <StockRoot initialValues={{}}>
            <h1>Todo list!</h1>
        </StockRoot>
    );
}

export default App;

And that's it! You've initialized your first app with stocked! Continue to the next section to complete this tutorial!