DEV Community

Cover image for App Generator - Build Really Nice Presentation Sites with Ease (free service)
Sm0ke
Sm0ke

Posted on • Originally published at appseed.us

App Generator - Build Really Nice Presentation Sites with Ease (free service)

Hello Coders!

This article presents a free app 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, Material Kit or Soft 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.

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:

$ docker-compose up --build 
Enter fullscreen mode Exit fullscreen mode

App Generator - Material Kit Design


✨ Steps to generate a new app

Access the generator page and select a design.

App Generator Material Kit - Select Design


👉 User selects the preferred backend

App Generator Material Kit - Select Backend


👉 Configure the future product

Database (persistence) layer and Deployment options


App Generator Material Kit - Customize the Project


👉 Confirm & Generate The Sources

App Generator Material Kit - Generate the Code


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.


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


👉 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

$ git clone https://github.com/appseed-projects/<YOUR_BUILD_ID>.git
$ cd <YOUR_BUILD_ID>
Enter fullscreen mode Exit fullscreen mode

Step #2 - Start in Docker

$ docker-compose up --build
Enter fullscreen mode Exit fullscreen mode

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.


Thanks for reading! For more resources, please access:

  • 👉 The Support page in case of any issues
  • 👉 ✨ More Free Starters generated using the same flow

Discussion (5)

Collapse
liviufromendtest profile image
Liviu Lupei

This is really awesome!

Collapse
zolidev profile image
Zoltán Szőgyényi

I've tried it out and it's quite an impressive feature. Congrats!

Collapse
sm0ke profile image
Sm0ke Author

ty!

Collapse
crearesite profile image
WebsiteMarket

This is really nice.

Collapse
sm0ke profile image
Sm0ke Author

Ty! 🚀🚀