### Install Framer Motion (Shell)

Source: https://github.com/richawo/framer-motion-cheatsheet/blob/main/notes.md

Installs the Framer Motion library as a project dependency using npm, enabling declarative animations and gestures.

```Shell
npm install framer-motion
```

--------------------------------

### Change Directory to Project Folder (Shell)

Source: https://github.com/richawo/framer-motion-cheatsheet/blob/main/notes.md

Navigates into the newly created project directory 'drag-examples' to perform subsequent setup steps.

```Shell
cd drag-examples
```

--------------------------------

### Run Development Server - Bash

Source: https://github.com/richawo/framer-motion-cheatsheet/blob/main/README.md

Starts the Next.js development server, making the application accessible locally for testing and development, typically at http://localhost:3000.

```bash
npm run dev
```

```bash
yarn dev
```

```bash
pnpm dev
```

--------------------------------

### Clone Framer Motion Next.js Repository - Bash

Source: https://github.com/richawo/framer-motion-cheatsheet/blob/main/README.md

Clones the project repository from GitHub to your local machine using the git command, initiating the setup process.

```bash
git clone https://github.com/richawo/framer-motion-nextjs.git
```

--------------------------------

### Install Project Dependencies - Bash

Source: https://github.com/richawo/framer-motion-cheatsheet/blob/main/README.md

Installs the required project dependencies using one of the popular Node.js package managers: npm, yarn, or pnpm. This step is necessary before running the development server.

```bash
npm install
```

```bash
yarn install
```

```bash
pnpm install
```

--------------------------------

### Install Tailwind CSS Dependencies (Shell)

Source: https://github.com/richawo/framer-motion-cheatsheet/blob/main/notes.md

Installs Tailwind CSS, PostCSS, and Autoprefixer as development dependencies using npm, which are required for integrating Tailwind CSS into the project.

```Shell
npm install -D tailwindcss postcss autoprefixer
```

--------------------------------

### Create Next.js App with TypeScript and ESLint (Shell)

Source: https://github.com/richawo/framer-motion-cheatsheet/blob/main/notes.md

Initializes a new Next.js project named 'drag-examples' using the latest template, configured with TypeScript and ESLint.

```Shell
npx create-next-app@latest drag-examples --typescript --eslint
```

--------------------------------

### Navigate to Project Directory - Bash

Source: https://github.com/richawo/framer-motion-cheatsheet/blob/main/README.md

Changes the current directory in the terminal to the newly cloned project folder, preparing for dependency installation.

```bash
cd framer-motion-nextjs
```

--------------------------------

### Initialize Tailwind CSS Configuration (Shell)

Source: https://github.com/richawo/framer-motion-cheatsheet/blob/main/notes.md

Generates the `tailwind.config.js` and `postcss.config.js` files required for configuring Tailwind CSS and PostCSS in the project.

```Shell
npx tailwindcss init -p
```

=== COMPLETE CONTENT === This response contains all available snippets from this library. No additional content exists. Do not make further requests.