Project Structure

Your new Peachy project generated from the create peachy CLI wizard already includes some files and folders.

Here’s how a Peachy project is organized, and some files you will find in your new project.

Directories and Files

• Directorydata/

  • Directoryicons/

    • icon1.svg
    • icon2.svg
    • icon3.svg
  • Directoryimages/

    • illustration1.jpg
    • illustration2.jpg
• Directorydist/

  • …
• Directorysrc/

  • Directorywidgets/

    • Header.tsx
    • Sidebar.tsx
    • …
  • Directorystyles/

    • styles.css
  • index.tsx
• Directorynode_modules/

  • …
• package.json
• tsconfig.json

src/

The src/ folder is where most of your project source code lives. This includes:

• Widgets: Custom components that can be reused throughout your project.
• Styles: CSS files that define the visual styles of your project.
• Index.tsx: The main entry point of your project.

data/

The data folder contains static data files that are not source code. This folder is organised into subfolders as well.

• Icons: The data/icons folder is a special folder that contains SVG files that can be used as icons in your project. [Learn how to use icons][icons]
• Images: JPEG files that can be used as images in your project.
• …: Other static data could be added here, such as videos, etc…

dist/

The dist/ folder is where the compiled output of your project is generated. This folder is not committed and is (re)generated by peachy while building your project or running the development server.

node_modules/

The node_modules folder contains all the npm dependencies of your project. This folder is not committed and is (re)generated by npm while installing dependencies.

package.json

The package.json file contains metadata about your project, such as its name, version, and dependencies. This file is used by npm to install dependencies and by peachy to build your project.

Check out the npm documentation for more information. And check out peachy configuration to learn how to configure your project.

tsconfig.json

The tsconfig.json file contains configuration options for the TypeScript compiler. By default, it uses peachy’s default configuration, so you probably won’t need to modify it.

Check out the TypeScript documentation for more information.