Copy .env.development.default to .env.development. Configure the right REACT_APP_API_URL in the .env.development and .env.production.

npm install
npm run start

Make sure to install the following plugins for VSCode:

• vscode-styled-components
• Prettier - Code formatter (after installation, enable "Format On Save" in your IDE)

• camelCase for Folder names;
• PascalCase for Javascript file names

When importing styled components: import a full file as s then refer to the components as s.Component as in the following example. This makes it clear what's a styled component and what's a normal component

    import * as s from "./Exercises.sc";
    ...
    <s.ExercisesColumn>
    ...

You're more prone to a mis-typing error that way. If you define a constant, you can benefit from auto-completion from your IDE.

E.g. If you end up definig a general random function, or a isUppercaseString(obj) function, etc. inside a component defintion, you're better moving them out of there. Two reasons:

1. it's likely that you'll need to use them in other places than that component
2. keeping things at the same abstraction level: the code in a component should worry about the main business of that component; not about defining generic functions.

E.g. If a child can update an element which requires a re-render from the parent, the pattern should be:

export default function Parent({}) {
...
    onNotifyChange()
    {
        // Handle the change from the child component
    }

...

    <Child
        notifyChange={onNotifyChange}
    />
}

This project was bootstrapped with Create React App.

The project expects /teacher-dashboard to be deployed at localhost:3000 - that's another zeeguu project