# Getting Started

# Prerequisites

Node.js v15 or higher (opens new window)

# 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.

← Introduction Configuration →