DEV Community

Cover image for Cookie Cutter Flask - Generate Websites with ease
Sm0ke
Sm0ke

Posted on • Originally published at blog.appseed.us

Cookie Cutter Flask - Generate Websites with ease

Hello Coders!

This article presents an open-source tool that we can use to generate simple, yet modern presentation websites on top of Flask Framework. Cookie Cutter Flask extends the popular CookieCutter command-line tool to build simple Flask projects enhanced with database, authentication, and Docker support using a theme-able approach where the user can select the design during the generation process. In the end, without any coding effort, the generator will provide a seed project similar to these LIVE samples:


Cookie Cutter Flask - Material Kit Design, generated sample project.


✨ How It works

CookieCutter tool is a popular open-source generator written in Python that knows how to build software projects using templates and user input. Basically, a codebase or a template project can be customized during the generation process based on the user input. Types of customizations:

  • Project name, author, and license type
  • Decide the database type we will use in our project
  • Inject deployment scripts for Docker
  • Add or remove basic features (authentication, for instance)

In order to use our simple Flask generator, a short-list with tools should be already present in the workstation:

  • Python3 - the language that powers CookieCutter
  • GIT - versioning command-line tool
  • A modern editor like VsCode or Atom

With all the tools properly installed and accessible in the terminal window, we can proceed further with our setup.


👉 Step #1 - Install Python modules: CookieCutter and GitPython

$ pip install cookiecutter
$ pip install GitPython
Enter fullscreen mode Exit fullscreen mode

👉 Step #2 - Generate the project via Flask Cookie Cutter

$ cookiecutter https://github.com/app-generator/cookiecutter-flask-sites.git
Enter fullscreen mode Exit fullscreen mode

The most important step is when we select the design:

>>> Select theme:
1 - material-kit
2 - pixel-lite
Choose from 1, 2 [1]: 1      <--- HERE We select the UI
Enter fullscreen mode Exit fullscreen mode

As mentioned before, the generator is theme-able and we can choose the design: Pixel Lite or Material Kit.


Pixel Lite - The Freelancer page

Pixel Lite - The Freelancer page.


Material Kit Website - User Page

Material Kit Website - User Page.


Once the Cookie Cutter collects the input from the user, the selected theme is downloaded from Github and the project is generated by taking into account all user options.

After the process is completed, we can compile and start the project using Docker or simply via a manual classic build for a Flask/Python project.

For the complete build instructions, please access the source code published on Github or ask for support via email or Discord.


Thanks for reading! For more resources and support, feel free to access:

Discussion (4)

Collapse
uithemes profile image
ui-themes

Really nice tool.
Can you tell me please the License that covers the generated code?
Ty

Collapse
sm0ke profile image
Sm0ke Author

MIT - means that you can use it for unlimited commercial end-products.
🚀🚀

Collapse
uithemes profile image
ui-themes

Noted, ty

Thread Thread
sm0ke profile image
Sm0ke Author

🚀🚀