## 1. Project Overview & Quickstart (Avaiga/taipy)
[](https://links.taipy.io/bookgithub)
Build Python Data & AI web applications
## Table of Contents
- [Taipy? What for?](#-what-for)
- [Taipy and its ecosystem](#-taipy-and-taipy-ecosystem)
- [Quickstart](#-quickstart)
- [Documentation and resources](#-documentation-and-resources)
- [Contributing](#-contributing)
- [Code of Conduct](#-code-of-conduct)
- [License](#-license)
## ⭐ What for?
Taipy is designed for data scientists and machine learning engineers to create
data & AI driven web applications.
⭐️ Enables building production-ready web applications.
⭐️ No need to learn new languages; only Python is needed.
⭐️ Focus on data and AI algorithms. Delegates development complexities to Taipy.
⭐️ Simplifies production operations (hosting, deployments, maintenance, etc.).
## ✨ Taipy and Taipy Ecosystem
Taipy includes the Taipy Python library enabling developers to easily empower their end-users with:
- User interface generation
- Data Integration
- Pipeline orchestration
- What-if analysis and scenario management
- Authentication, roles and user management
- Cron jobs and scheduling
Besides the Taipy Library, the Taipy Ecosystem includes:
- Taipy Designer
- Taipy Studio
- Predefined templates
- Data platform integration
Taipy comes with a set of materials to facilitate production operations and maintenance.
- Command line interface.
- Deployment scripts.
- Version Management.
- Data migration.
- Telemetry and monitoring.
## ⏩ Quickstart
To install the stable release of Taipy, run:
```bash
pip install taipy
```
For alternative installation methods, an
[Installation Guide](https://docs.taipy.io/en/latest/tutorials/getting_started/installation/)
provides step-by-step instructions.
## 💡 Documentation and resources
A comprehensive documentation set is available at
[Taipy Documentation](https://docs.taipy.io/en/latest/) to help you with Taipy tools.
It includes
[Tutorials](https://docs.taipy.io/en/latest/tutorials/),
[user manuals](https://docs.taipy.io/en/latest/userman/),
[API references](https://docs.taipy.io/en/latest/refmans/), and
[Galleries](https://docs.taipy.io/en/latest/gallery/).
## ⚒️ Contributing
Want to help build Taipy? Check out our [**Contributing Guide**](https://github.com/Avaiga/taipy/blob/develop/CONTRIBUTING.md).
## 🪄 Code of Conduct
Want to be part of the Taipy community? Check out our [**Code of Conduct**](https://github.com/Avaiga/taipy/blob/develop/CODE_OF_CONDUCT.md)
## 🪪 License
Copyright 2021-2025 Avaiga Private Limited
Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in compliance with
the License. You may obtain a copy of the License at
[Apache License](https://www.apache.org/licenses/LICENSE-2.0.txt)
Unless required by applicable law or agreed to in writing, software distributed under the License is distributed on
an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for the
specific language governing permissions and limitations under the License.
## 2. Official Technical Reference & Guides (Avaiga/website)
# Next.js TypeScript Tailwind Starter
This is a [Next.js](https://nextjs.org/) project bootstrapped with [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app).
## Table of Contents
- [Getting Started](#getting-started)
- [Usage](#usage)
- [Learn more](#learn-more)
- [Build the website](#deploy-on-vercel)
- [Project Structure](#project-structure)
- [Code Style](#code-style)
- [ESLint](#eslint)
- [Prettier](#prettier)
- [VS Code](#vs-code)
## Getting Started
1. Clone this repository or hit "Use this template" button
```bash
git clone git@github.com:pixel-point/nextjs-typescript-tailwind-starter.git
```
2. Install dependencies
```bash
npm install
```
## Usage
```bash
npm run dev
```
Open [http://localhost:3000](http://localhost:3000) with your browser to see the result.
You can start editing the page by modifying `app/page.tsx`. The page auto-updates as you edit the file.
### Learn More
To learn more about Next.js, take a look at the following resources:
- [Next.js Documentation](https://beta.nextjs.org/docs) - learn about Next.js features and API.
- [Learn Next.js](https://nextjs.org/learn) - an interactive Next.js tutorial.
You can check out [the Next.js GitHub repository](https://github.com/vercel/next.js/) - your feedback and contributions are welcome!
### Deploy on Vercel
The easiest way to deploy your Next.js app is to use the [Vercel Platform](https://vercel.com/import?utm_medium=default-template&filter=next.js&utm_source=create-next-app&utm_campaign=create-next-app-readme) from the creators of Next.js.
Check out our [Next.js deployment documentation](https://nextjs.org/docs/deployment) for more details.
## Project Structure
```text
├── public
├── src
│ ├── components
│ │ ├── pages — React components that are being used specifically on a certain page
│ │ └── shared — React components that are being used across the whole website
│ ├── app
│ ├── svgs — a folder for vector images
│ ├── images — a folder for bitmap images
│ ├── lib
│ ├── types
├── next.config.js — Main configuration file for a Next.js site. Read more about it [here](https://nextjs.org/docs/api-reference/next.config.js/introduction)
└── tailwind.config.js — Main configuration file for Tailwind CSS [Read more about it here](https://tailwindcss.com/docs/configuration)
```
## Component Folder Structure
### Each component includes
1. Main TypeScript File
2. Index File
### Each component optionally may include
1. Folder with images and icons
2. Folder with data
Also, each component may include another component that follows all above listed rules.
### Example structure
```bash
component
├── nested-component
│ ├── data
│ │ └── nested-component-lottie-data.json
│ ├── images
│ │ ├── nested-component-image.jpg
│ │ ├── nested-component-inline-svg.inline.svg
│ │ └── nested-component-url-svg.url.svg
│ ├── nested-component.tsx
│ └── index.ts
├── data
│ └── component-lottie-data.json
├── images
│ ├── component-image.jpg
│ ├── component-inline-svg.inline.svg
│ └── component-url-svg.url.svg
├── component.tsx
└── index.ts
```
## Code Style
### ESLint
[ESLint](https://eslint.org/) helps find and fix code style issues and force developers to follow same rules. Current configuration is based on `eslint:recommended`, `next/core-web-vitals` and `@typescript-eslint/recommended` rules sets.
Additional commands:
```bash
npm run lint
```
Run it to check the current status of eslint issues across project.
```bash
npm run lint:fix
```
Run it to fix all possible issues.
### Prettier
[Prettier](https://prettier.io/) helps to format code based on defined rules. [Difference between Prettier and ESLint](https://prettier.io/docs/en/comparison.html).
Additional commands:
```bash
npm run format
```
Run it to format all files across the project.
### VS Code
Following extensions required to simplify the process of keeping the same code style across the project:
- [ESLint](https://marketplace.visualstudio.com/items?itemName=dbaeumer.vscode-eslint)
- [Prettier](https://marketplace.visualstudio.com/items?itemName=esbenp.prettier-vscode)
After installation, VS Code will be use settings from the `.vscode/settings.json` file and will be fixing and formatting your code automatically on paste and save actions.