# Getting Started

# Prerequisites

# Create a new project

The following commands create a project in a new folder called project-name. To create a new project in the current directory use a . (dot) instead of a project name.

Choose one of the following methods:

# CLI with npx (opens new window)

npx @pangolinjs/cli@next create project-name

# Globally installed CLI

npm install --global @pangolinjs/cli@next
pangolin create project-name

# Project structure

├── public
│   └── …
├── src
│   ├── components
│   │   └── …
│   ├── css
│   │   └── …
│   ├── docs
│   │   └── …
│   ├── main.js
│   └── main.scss
├── .browserslistrc
├── .eslintrc.cjs
├── babel.config.js
├── [pangolin.config.js]
├── postcss.config.cjs
└── stylelint.config.cjs

# Configuration

File Purpose
.browserslistrc Browserslist (opens new window) configuration
.eslintrc.cjs ESLint (opens new window) configuration
babel.config.js Babel (opens new window) configuration
pangolin.config.js Optional Pangolin configuration
postcss.config.cjs PostCSS (opens new window) configuration
stylelint.config.cjs stylelint (opens new window) configuration

# Folders

Folder Purpose
public Static files that will be copied as-is to the output directory.
src/components Everything is a component: the smallest button and the most complex page.
src/css Changeable Global CSS files, like variables or body styles.
src/docs Optional Fractal documentation pages. (opens new window)

# Files

File Purpose
src/main.js The main JavaScript entry point. Use this file to import all other JS files.
src/main.scss The main CSS entry point. Use this file to @use all other CSS files.