App Generator - Build Really Nice Presentation Sites with Ease (free service)
Tags: webdev, generator, beginners
Published: 2022-05-17 17:16:41

---
title: App Generator - Build Really Nice Presentation Sites with Ease (free service)
published: true
description: A visual way to generate simple presentation sites using a visual generator
tags: webdev, generator, beginners
cover_image: https://dev-to-uploads.s3.amazonaws.com/uploads/articles/z700wiofkh00dqcdd39a.jpg
canonical_url: https://appseed.us/generator/
---
Hello Coders!

This article presents a free [app generator](https://appseed.us/generator/) that a developer or a designer can use to generate a simple full-stack starter on top of pixel-perfect **Bootstrap 5 UI Kits**. This free service `collects the user input` (design, backend framework, database type and deployment scripts), `generate` the code and `saves the code on Github` (public repository). The process usually takes between 30 seconds and 2minutes (with GH upload time included). 

> *Thanks for reading!* Being a new service, any `feedback` (pros & cons) `is more than welcomed`. 

---

## ✨ How it Works 

Using this free service is pretty simple. The User access the **App Generator** page, select the design (Material Kit in this case), and follow the next steps provided by the visual tool. 

- #1 - **Select the Design**: [Pixel](https://appseed.us/generator/pixel-bootstrap/), [Material Kit](https://appseed.us/generator/material-kit/) or [Soft Design](https://appseed.us/generator/soft-ui-design/)
- #2 - **Select the preferred backend**: `Flask` or `Django`
- #3 - `Configure the project`
  - `Persistence`: Mysql, SQLite or None   
  - `Deployment` Integration: Doker or HEROKU

Once the user confirms the options, the code is generated and saved on Github. As mentioned before, the process should take under 2minutes. 

---

### ✨ Generated Samples 

Curious minds can take a look at two generated projects using the default options for `Flask` & `Django` backends on top of [Material Kit Design](https://appseed.us/generator/material-kit/).

- 👉 [Flask Material Kit](https://github.com/appseed-projects/9445f802-08d9-4a67-ab62-4b4282103e0b) - source code, [LIVE Demo](https://flask-material-kit.appseed-srv1.com/)
- 👉 [Django Material Kit](https://github.com/appseed-projects/4b4f7096-dec1-463b-8975-db0d0da50a09) - source code, [LIVE Demo](https://django-material-kit.appseed-srv1.com/)

Both projects were generated with `Docker` support and we can start the projects using a single command executed in the route of the source code: 

```bash
$ docker-compose up --build 
```  

![App Generator - Material Kit Design](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/tbsrl066uja9ui7xnrax.png)

---

## ✨ Steps to generate a new app

Access the [generator](https://appseed.us/generator/) page and select a design.  

![App Generator Material Kit - Select Design](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ph9gbybqpvqk6l2yxoe5.png)

--- 

### 👉 User selects the preferred backend

![App Generator Material Kit - Select Backend](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/50majpn4p2ghp6tlz87v.png)
  
---

### 👉 Configure the future product

Database (persistence) layer and Deployment options

---

![App Generator Material Kit - Customize the Project](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/3n5otpk36qg0njpv1mq6.png)

---

### 👉 Confirm & Generate The Sources

![App Generator Material Kit - Generate the Code](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/2agxhmncwh4n512uztze.png)

---

Once the server accepts the request, we can see the progress and access the sources when the process is finished.

---

![App Generator Material Kit - Check Progress. ](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/xsrwu4gvxcijt5xb8u70.gif)

---

### 👉 Access the Sources (Github)

The generated code is automatically saved on Github and is ready to be downloaded by the user.

![App Generator Material Kit - Final Status. ](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/98tg2v08r1hled05otjn.png)

---

### 👉 Use the Code

Using GIT and a terminal, we can download the sources and start the project with a few commands typed in the terminal.

> Step #1 - Download the sources via `GIT`

```bash
$ git clone https://github.com/appseed-projects/<YOUR_BUILD_ID>.git
$ cd <YOUR_BUILD_ID>
``` 

---

> Step #2 - Start in Docker

```bash
$ docker-compose up --build
``` 
 
At this point, we should be able to access the generated project in the browser: `localhost:85`. 

---

![App Generator - Generated App (Material Kit Desing), animated presentation.](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/idv1jb6g46jbed08gft7.gif)

--- 

> Thanks for reading! For more resources, please access: 

- 👉 The [Support](https://appseed.us/support/) page in case of any issues 
- 👉 ✨ More [Free Starters](https://appseed.us/admin-dashboards/open-source) generated using the same flow