Project Blueprint
Design your file and folder structure below.
1
Project Templates
Get a head start with these popular project structures. Click "Use Template" to load it into the creator.
React App
A standard client-side React application structure, similar to `create-react-app`.
/public/\n └── index.html\n/src/\n ├── /components/\n ├── /hooks/\n ├── App.js\n └── index.js\n.gitignore\npackage.json
Node.js Express API
A robust structure for a Node.js API server using the Express framework.
/config/\n └── db.js\n/controllers/\n/models/\n/routes/\n └── api.js\n.env\n.gitignore\npackage.json\nserver.js
Python Flask App
A classic structure for a web application built with the Python Flask micro-framework.
/static/\n ├── /css/\n └── /js/\n/templates/\n └── index.html\napp.py\nconfig.py\nrequirements.txt
Vue.js App
A standard project layout for a Vue 3 application, perfect for building interactive UIs.
/public/\n └── index.html\n/src/\n ├── /assets/\n ├── /components/\n ├── App.vue\n └── main.js\n.gitignore\npackage.json
Next.js App
A modern structure for a server-rendered React app using the Next.js App Router.
/app/\n ├── /api/\n ├── layout.js\n └── page.js\n/public/\n.gitignore\nnext.config.mjs\npackage.json
Basic Website
A fundamental template for any simple static website using HTML, CSS, and JavaScript.
/css/\n └── style.css\n/images/\n/js/\n └── script.js\nindex.html
Discord.js Bot
A command-handler structure for a modern Discord bot using the Discord.js v14 library.
/commands/\n └── ping.js\n/events/\n └── ready.js\n.env\n.gitignore\nindex.js\npackage.json
How It Works
Project Scripter is designed to be intuitive. Here’s a breakdown of how to create your project structure, from manual creation to using our new AI-powered assistant.
✨ Method 1: Generate with AI (Recommended)
- Describe Your Project: In the "Describe Your Project" field, type a natural language description of what you want to build. Be as descriptive as you like! For example: "A full-stack web app using Next.js for the frontend, Express.js for the backend API, and connecting to a MongoDB database."
- Generate Structure: Click the "✨ Generate with AI" button. Our tool will send your request to the Gemini API.
- Review & Download: The AI will generate a professional file structure and populate the editor. It will also suggest a project name. Review the structure, make any tweaks you like, and then click "Download .zip".
Method 2: Manual Creation
- Set Project Name: Enter your root project name in the input field. This will be the name of your downloaded zip file.
- Define Structure: In the editor, type your desired file and folder structure.
- End folder names with a forward slash:
/my-folder/ - Use two spaces for each level of indentation.
- File names don't need a special character:
index.html
- End folder names with a forward slash:
- Download: Click the "Download .zip" button to generate and save your project skeleton.
Method 3: Use a Template
- Visit the Templates Page: Navigate to the "Templates" section using the main menu.
- Choose a Template: Browse our list of common project types like React, Node.js, and more.
- Load and Download: Click "Use this Template". You will be taken back to the Creator Tool with the project name and structure pre-filled. Simply click "Download .zip".
Developer Guides
Articles on software development best practices, project structure, and more.
The Perfect Folder Structure for a MERN Stack App
Discover a robust and scalable folder structure for your next MERN (MongoDB, Express, React, Node.js) project. We'll cover separating concerns, managing state, and organizing components for maintainability.
5 Common Mistakes in Project Scaffolding
Avoid common pitfalls when starting a new project. This guide covers issues like improper dependency management, neglecting a `.gitignore` file, and creating overly complex initial structures that hinder development speed.
About Project Scripter
Project Scripter was born from the repetitive task that every developer faces: setting up a new project. The initial moments of a project are crucial for establishing a clean, scalable, and maintainable foundation. Our goal is to streamline this process, allowing you to move from idea to coding in seconds.
Whether you're a seasoned developer who wants to bootstrap projects quickly or a beginner learning about best-practice file structures, Project Scripter is here to help. With our manual creator, pre-built templates, and powerful AI assistant, you have the flexibility to create the perfect project skeleton for any need.
This tool is open-source and built with modern web technologies. We believe in the power of community and welcome contributions and suggestions.
Privacy Policy
Last Updated: September 27, 2025
Your privacy is important to us. It is Project Scripter's policy to respect your privacy regarding any information we may collect from you across our website.
1. Information We Collect
We do not collect any personally identifiable information. The project descriptions you enter for AI generation are sent to the Gemini API for processing but are not stored by us. The project structures you create are processed entirely within your browser and are not saved on our servers.
2. Cookies
We do not use cookies for tracking purposes.
3. Third-Party Services
This website uses Google's Gemini API to provide the AI generation feature. Your use of this feature is subject to Google's privacy policy.