Login Form Setup Guide

User Manual:

Open the PDF directly: View PDF PDF.
Page Count: 6

DownloadLogin Form Setup Guide
Open PDF In BrowserView PDF
Log-In Form Project Setup
How to set up your development environment using PyCharm
This tutorial starts your journey into creating database driven web applications. You will learn how
to use the PyCharm to:
 Connect to GitHub and download a repository
 Set Up a virtual environment and add packages to run the program
 Configure environment variables and run the application in a web browser

Before you start
Ensure that you have the following programs installed on your computer:






Python 3
PyCharm
DB Browser for SQLite
Brackets
Git

Setting up GitHub
Open git hub on your windows machine:

 Step 1: Click Configure  Settings

 Step 2: Click Version Control  GitHub  Add Account then enter your account details and
Log In to the account.

Cloning the GitHub repository
All the files that you need for this project live on the github code repository. They can be
downloaded manually from https://github.com/brighton-college-computing-department/login-form
but it is easier to set up if you let PyCharm do it for you.

 Step 3: Select Check out from Version Control  Git. Type the URL in as shown below.
Choose the folder where you keep your programming projects then add the name of the
project (login-form). Click Clone

Set Up the Virtual Environment for the project
A virtual environment is where you create a stand-alone programming environment for a given
project. Programmers do this as it prevents problems occurring when packages that a program is
using become updated and over time the source code is no longer compatable with the packages
that it is dependent on. This project will use Flask. As such we will create a folder, venv, that will
store the current version of python along with the package, flask, that we are using and all of the
other packages that flask is dependent upon.

 Step 4: Select File  Settings (Ctrl+Alt+S)  Project: login-form  Project Interpreter.
Select the cog button and add.

 Step 5: Ensure that you have selected the correct directory and added venv on to the end of
the path name then click OK twice.
 Step 6: You now need to add flask to the environment. Click the plus button (+), search for
flask in the search bar and then click install package.

You will note that the pip program that installs packages from the python package index (pypi) also
has installed all of the other dependencies. These are the packages that flask in turn uses:

Run in development mode
You are now almost ready to run your app. Before you do this you must add an environment
variable.
 Step 7: Select app.py from the project pane under login form:

 Step 8: Edit the configuration of how this module runs by selecting the option below:

 Step 9: Click the folder next to the Environment Variables text box followed by the +
button. Add the following environment variable:

The flask program will now run in development mode. This means that should you save you python
file you will only need to refresh the browser to update the program, as opposed to restarting the
program each time.

Running the Login Form App
The final step is to start the application.
 Step 10: Click the run button on the top right hand of the screen. The console will open and
you will select the hyperlink to http://127.0.0.1:5000/
The app should appear as below:
Source Exif Data: 
File Type                       : PDF
File Type Extension             : pdf
MIME Type                       : application/pdf
PDF Version                     : 1.5
Linearized                      : No
Page Count                      : 6
Language                        : en-GB
Author                          : Scott, Mr Matthew
Creator                         : Microsoft® Word 2016
Create Date                     : 2019:01:30 00:34:34+00:00
Modify Date                     : 2019:01:30 00:34:34+00:00
Producer                        : Microsoft® Word 2016
EXIF Metadata provided by EXIF.tools

Navigation menu