Giter Club home page Giter Club logo

ecommerce-base's Introduction

Getting Started with Flask on Azure App Service

This is a simple Flask app that can be deployed to Azure App Service. It is meant to be used as a starting point for building your own Flask apps that can be deployed to Azure.

Developer Documentation: Getting Started

Prerequisites

  • Python 3.10.9+ installed on your machine (lower versions may work but are not tested)
  • Git installed on your machine
  • Visual Studio Code installed on your machine

Setup

  1. Clone the repository to your local machine using Git.

  2. Open the cloned repository in Visual Studio Code.

  3. Create a Python virtual environment at the root of the project by running the following command in the terminal:

    python3 -m venv venv
  4. Activate the virtual environment by running the following command in the terminal:

    source venv/bin/activate
  5. Install the required packages by running the following command in the terminal:

    pip install -r requirements.txt
  6. Create a .env file at the root of the project and add the following line:

    ENV=development

Sure! Here's the updated section with the revised instructions for toggling the debug mode:

Running the App Locally

  1. Open the .vscode/launch.json file included in the project.
  2. In the configurations section, you will find a configuration named Flask: App (Local). This configuration is already set up to run the Flask app locally.
  3. To enable the debug mode and see debug information on the UI, make sure the noDebug option in the launch.json file is set to false.
  4. To disable the debug mode and not see debug information on the UI, you can comment out the args key in the Flask: App (Local) configuration by adding // before the line.
  5. Click on the "Run and Debug" button in Visual Studio Code (or press F5) to start the app.
  6. Open your web browser and navigate to http://localhost:5000 to access the app.

Note: Make sure the virtual environment is activated before running the app locally.

Viewing the Local Database

  1. The Flask app uses a local database instance for storing data.
  2. To view the contents of the local database, you can use the recommended extensions for Visual Studio Code located in .vscode/extensions.json.
  3. Once the extension is installed, you can connect to the local database instance and view its contents directly within Visual Studio Code.

Note: The specific steps for connecting to and viewing the local database may vary depending on the extension you choose. Please refer to the documentation of the extension for detailed instructions.

Project Structure Details

The project structure for the Flask app is as follows:

flask_api
├─ .deployment
├─ .gitignore
├─ .vscode
│  ├─ extensions.json
│  ├─ launch.json
│  └─ settings.json
├─ app.py
├─ config.py
├─ extensions.py
├─ instance
│  └─ app.db
├─ modules
│  ├─ __init__.py
│  ├─ forms.py
│  ├─ loginManager.py
│  ├─ models.py
│  └─ routes.py
├─ requirements.txt
├─ run.py
├─ startup.txt
├─ templates
│  ├─ base.html
│  ├─ homepage.html
│  ├─ index.html
│  ├─ login.html
│  └─ register.html
└─ tests
   ├─ __init__.py
   └─ test_routes.py

Here is a breakdown of the different directories and files in the project:

  • .deployment: Contains deployment-specific configuration files for Azure App Service.
  • .gitignore: Specifies files and directories that should be ignored by Git version control.
  • .vscode: Contains configuration files for Visual Studio Code IDE.
    • extensions.json: Lists recommended extensions for the project.
    • launch.json: Configures the launch configurations for running the app locally.
    • settings.json: Customizes the settings for the Visual Studio Code workspace.
  • app.py: The main entry point of the Flask application.
  • config.py: Contains configuration settings for the Flask app.
  • extensions.py: Initializes and configures Flask extensions used in the app.
  • instance: Directory for storing instance-specific data (e.g., local database file).
  • modules: Directory for organizing different modules of the Flask app.
    • __init__.py: Initializes the Flask module.
    • forms.py: Defines forms used in the app.
    • loginManager.py: Configures the login manager for user authentication.
    • models.py: Defines the database models for the app.
    • routes.py: Defines the routes and corresponding view functions for the app.
  • requirements.txt: Lists the required Python packages and their versions.
  • run.py: A script to run the Flask app.
  • startup.txt: Contains instructions or notes for setting up and running the app.
  • templates: Directory for storing HTML templates used in the app.
  • tests: Directory for storing unit tests for the app.

This project structure follows common conventions for organizing a Flask application, separating concerns into different modules and directories.

That's the overview of the project structure. It provides a clear separation of concerns and makes it easier to navigate and maintain the Flask app codebase.

Deployment

To deploy the Flask app to Azure App Service, follow these steps:

  1. Start up an Azure Web App.
  2. Make sure you have Python installed on your machine. If not, install it.
  3. Install the Azure App Service extension in Visual Studio Code.
  4. Open the command palette in Visual Studio Code (press Ctrl+Shift+P or Cmd+Shift+P) and search for "Azure: Sign In" to sign in to your Azure account.
  5. Once signed in, open the command palette again and search for "Azure App Service: Create New Web App".
  6. Follow the prompts to create a new web app. Select the appropriate subscription, resource group, and other configuration options.
  7. After creating the web app, open the command palette and search for "Azure App Service: Deploy to Web App".
  8. Select the web app you created in the previous step.
  9. Choose the deployment method (e.g., Local Git, GitHub, Azure DevOps, etc.) and follow the prompts to complete the deployment.
  10. Once the deployment is complete, navigate to the Azure portal and open the web app.
  11. In the web app's settings, locate the "Configuration" section.
  12. Add the following application settings:
    • ENV: Set the value to production.
    • SECRET_KEY: Set the value to a secure secret key for your app.
  13. Save the configuration changes.
  14. Restart the web app to apply the new configuration settings.
  15. Your Flask app should now be deployed and accessible through the Azure web app URL.

Make sure to replace any placeholder values (e.g., <your-web-app-name>, <your-resource-group>) with the actual names you used during the deployment process.

That's the overview of deploying the Flask app to Azure App Service. By following these steps, you can easily deploy your Flask app and make it available on the web.

ecommerce-base's People

Contributors

nebulusio avatar

Watchers

 avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.