当前位置: 首页 > 软件库 > Web应用开发 > Web框架 >

full-stack

授权协议 MIT License
开发语言 JavaScript
所属分类 Web应用开发、 Web框架
软件类型 开源软件
地区 不详
投 递 者 万志专
操作系统 跨平台
开源组织
适用人群 未知
 软件概览

Full Stack Flask and PostgreSQL - Base Project Generator

Generate a backend and frontend stack using Python, including interactive API documentation.

Notice: Flask or FastAPI

If you are using this project (or Flask in general to create web APIs) you would probably benefit more from FastAPI.

You can use the equivalent sibling project generator based on FastAPI: https://github.com/tiangolo/full-stack-fastapi-postgresql. It also has more features than this one.

FastAPI was created from the learnings acquired while creating and using these project generators for Flask, with all the plug-ins and ideas.

  • FastAPI (and its project generators), would give you about 800% (8x) the performance achievable with this one.
  • Writing code in FastAPI is about 200% to 300% faster. Because you write a lot less code, it is designed for web APIs, and you have auto-complete everywhere.
  • About 40% of the human (developer) induced errors can be reduced (FastAPI does a lot of the data validation, conversion and documentation for you).

⚠️ DEPRECATION WARNING ⚠️

As FastAPI and the equivalent project generator provide a much better solution to all the use cases this project was built for, all the future development will be done there.

You are still free to use this project, but it won't receive any new features, changes, or bug fixes.


Features

  • Full Docker integration (Docker based)
  • Docker Swarm Mode deployment
  • Docker Compose integration and optimization for local development
  • Production ready Python web server using Nginx and uWSGI
  • Python Flask backend with:
    • Flask-apispec: Swagger live documentation generation
    • Marshmallow: model and data serialization (convert model objects to JSON)
    • Webargs: parse, validate and document inputs to the endpoint / route
    • Secure password hashing by default
    • JWT token authentication
    • SQLAlchemy models (independent of Flask extensions, so they can be used with Celery workers directly)
    • Basic starting models for users and groups (modify and remove as you need)
    • Alembic migrations
    • CORS (Cross Origin Resource Sharing)
  • Celery worker that can import and use models and code from the rest of the backend selectively (you don't have to install the complete app in each worker)
  • REST backend tests based on Pytest, integrated with Docker, so you can test the full API interaction, independent on the database. As it runs in Docker, it can build a new data store from scratch each time (so you can use ElasticSearch, MongoDB, CouchDB, or whatever you want, and just test that the API works)
  • Easy Python integration with Jupyter Kernels for remote or in-Docker development with extensions like Atom Hydrogen or Visual Studio Code Jupyter
  • Vue frontend:
    • Generated with Vue CLI
    • JWT Authentication handling
    • Login view
    • After login, main dashboard view
    • Vuex
    • Vue-router
    • Vuetify for beautiful material design components
    • TypeScript
    • Docker server based on Nginx (configured to play nicely with Vue-router)
    • Docker multi-stage building, so you don't need to save or commit compiled code
    • Frontend tests ran at build time (can be disabled too)
    • Made as modular as possible, so it works out of the box, but you can re-generate with Vue CLI or create it as you need, and re-use what you want
  • PGAdmin for PostgreSQL database, you can modify it to use PHPMyAdmin and MySQL easily
  • Swagger-UI for live interactive documentation
  • Flower for Celery jobs monitoring
  • Load balancing between frontend and backend with Traefik, so you can have both under the same domain, separated by path, but served by different containers
  • Traefik integration, including Let's Encrypt HTTPS certificates automatic generation
  • GitLab CI (continuous integration), including frontend and backend testing

How to use it

Go to the directoy where you want to create your project and run:

pip install cookiecutter
cookiecutter https://github.com/tiangolo/full-stack

Generate passwords

You will be asked to provide passwords and secret keys for several components. Open another terminal and run:

openssl rand -hex 32
# Outputs something like: 99d3b1f01aa639e4a76f4fc281fc834747a543720ba4c8a8648ba755aef9be7f

Copy the contents and use that as password / secret key. And run that again to generate another secure key.

Input variables

The generator (cookiecutter) will ask you for some data, you might want to have at hand before generating the project.

The input variables, with their default values (some auto generated) are:

  • project_name: The name of the project

  • project_slug: The development friendly name of the project. By default, based on the project name

  • domain_main: The domain in where to deploy the project for production (from the branch production), used by the load balancer, backend, etc. By default, based on the project slug.

  • domain_staging: The domain in where to deploy while staging (before production) (from the branch master). By default, based on the main domain.

  • docker_swarm_stack_name_main: The name of the stack while deploying to Docker in Swarm mode for production. By default, based on the domain.

  • docker_swarm_stack_name_staging: The name of the stack while deploying to Docker in Swarm mode for staging. By default, based on the domain.

  • secret_key: Backend server secret key. Use the method above to generate it.

  • first_superuser: The first superuser generated, with it you will be able to create more users, etc. By default, based on the domain.

  • first_superuser_password: First superuser password. Use the method above to generate it.

  • backend_cors_origins: Origins (domains, more or less) that are enabled for CORS (Cross Origin Resource Sharing). This allows a frontend in one domain (e.g. https://dashboard.example.com) to communicate with this backend, that could be living in another domain (e.g. https://api.example.com). It can also be used to allow your local frontend (with a custom hosts domain mapping, as described in the project's README.md) that could be living in http://dev.example.com:8080 to cummunicate with the backend at https://stag.example.com. Notice the http vs https and the dev. prefix for local development vs the "staging" stag. prefix. By default, it includes origins for production, staging and development, with ports commonly used during local development by several popular frontend frameworks (Vue with :8080, React, Angular).

  • postgres_password: Postgres database password. Use the method above to generate it. (You could easily modify it to use MySQL, MariaDB, etc).

  • pgadmin_default_user: PGAdmin default user, to log-in to the PGAdmin interface.

  • pgadmin_default_user_password: PGAdmin default user password. Generate it with the method above.

  • traefik_constraint_tag: The tag to be used by the internal Traefik load balancer (for example, to divide requests between backend and frontend) for production. Used to separate this stack from any other stack you might have. This should identify each stack in each environment (production, staging, etc).

  • traefik_constraint_tag_staging: The Traefik tag to be used while on staging.

  • traefik_public_network: This assumes you have another separate publicly facing Traefik at the server / cluster level. This is the network that main Traefik lives in.

  • traefik_public_constraint_tag: The tag that should be used by stack services that should communicate with the public.

  • flower_auth: Basic HTTP authentication for flower, in the formuser:password. By default: "root:changethis".

  • sentry_dsn: Key URL (DSN) of Sentry, for live error reporting. If you are not using it yet, you should, is open source. E.g.: https://1234abcd:5678ef@sentry.example.com/30.

  • docker_image_prefix: Prefix to use for Docker image names. If you are using GitLab Docker registry it would be based on your code repository. E.g.: git.example.com/development-team/my-awesome-project/.

  • docker_image_backend: Docker image name for the backend. By default, it will be based on your Docker image prefix, e.g.: git.example.com/development-team/my-awesome-project/backend. And depending on your environment, a different tag will be appended ( prod, stag, branch ). So, the final image names used will be like: git.example.com/development-team/my-awesome-project/backend:prod.

  • docker_image_celeryworker: Docker image for the celery worker. By default, based on your Docker image prefix.

  • docker_image_frontend: Docker image for the frontend. By default, based on your Docker image prefix.

How to deploy

This stack can be adjusted and used with several deployment options that are compatible with Docker Compose, but it is designed to be used in a cluster controlled with pure Docker in Swarm Mode with a Traefik main load balancer proxy handling automatic HTTPS certificates, using the ideas from DockerSwarm.rocks.

Please refer to DockerSwarm.rocks to see how to deploy such a cluster in 20 minutes.

More details

After using this generator, your new project (the directory created) will contain an extensive README.md with instructions for development, deployment, etc. You can pre-read the project README.md template here too.

History

Note about Angular: a previous version of this project generated a basic default Angular frontend application, but without any view or interaction with the rest of the stack (the backend API). I recently switched to Vue for frontend and used it to created the basic frontend views for this project (that didn't exist before). If you are interested in keeping the Angular version, let me know in an issue, I can create an Angular version of the project (without the current default views), then you can integrate your Angular app with the basic Dockerfile and additional files.

This project was based on senseta-os/senseta-base-project.

As I was the only maintainer, I'm continuing the development in this fork (https://github.com/tiangolo/full-stack).

License

This project is licensed under the terms of the MIT license.

  • full-stack 的设计,意味着各层能够无缝的集成在一起,遵循的DRY原则(don't repeat yourself),将各层共用的东西,抽取出来,并通过自顶向下的设计,无缝的集成在一起,粘合在一起,达到更高层次、更粗粒度的重用,同时为了保证灵活的可扩展性,在更高、更粗的粒度上遵守开放-封闭的原则,在各层的各个关键点,要提供诸多的钩子,回调的接口,供使用者扩展。full-stack的设计,在

 相关资料
  • Full-Stack-Notes 一个处于萌芽阶段的知识库,用于持续分享自己的所见、所学、所思! 点击切换详细目录 ☕ JAVA Java 反射与注解 Java 并发编程 Java NIO 核心组件详解 Java 函数式编程 Java 设计模式 Java 虚拟机 JVM 性能监控之命令行工具 JVM 性能监控之可视化工具 Tomcat 架构解析 Java 集合类源码解析 �� 网络基础 计算机网络

  • Full-Stack Roadmap 2021 This is a repository holding information and resources for everyone interested in becoming a Full-Stack Web Developer in 2021. As you can see, this stack is a bit biased as I c

  • Angular Full Stack Angular Full Stack is a project to easly get started with the latest Angular using a real backend and database. Whole stack is in TypeScript, from frontend to backend, giving you th

  • Full Reactive Stack This repository contains backend and frontend projects that make use of Reactive Web patterns,as explained in the mini book Full Reactive Stack with Spring Boot 2, WebFlux, MongoDB

  • This codebase goes along with the tutorial The Complete Guide to Full Stack Ethereum Development The video course for this codebase is located here Getting started Here's how to deploy this project Cl

  • 描述 (Description) 完整布局类型用于显示整个表单元素。 例子 (Example) 以下示例演示了表单的完整布局,包括Framework7中的所有字段 - <!DOCTYPE html> <html> <head> <meta name = "viewport" content = "width = device-width, initial-scale = 1,