CMPSC 431W Spring 2019Project Setup TutorialOverviewThis tutorial aims to provide information about setting up the development environment to be usedfor project management and database application development in Phase 2, throughout the rest ofthe semester. Note that the project requires you to build a web site. The precise details of whatyou will be implementing will be shared later. The elements to be implemented include 1) thefront-end web page; 2) the web/application server; and 3) the backend database. We first describethe system architecture of the database application in brief.HTML (preferably coupled with CSS) are used for front-end, which defines the look-and-feel ofyour website. For the web-server, we suggest you use Python. The installation instructions can befound in the section entitled “Install Python”. In addition, we recommend FLASK, a Pythonorientedweb development framework which helps to productively implement your websitefunctionality. FLASK provides an API to receive requests from the website (such as formsubmissions, clicks, login request, etc.) and return responses back to the front-end (such as displaythe result of a login – success or failure, display information as requested by the user, etc.)Moreover, all SQL queries are issued by FLASK to the backend database in response to userrequests. For example, consider an application function where a student asks for his grades to bedisplayed, FLASK issues an appropriate SQL query to the database server, which retrieves thedata and return it to FLASK, which in turn sends the result (with proper rendering) to the client(browser) for display.SQLite is suggested for use as the database management system in this project due to its portability.SQLite works by maintaining a local “database file” which will be queried by your application(i.e., the website). SQLite3 (a version of SQLite) execute a query and returns its result to FLASK.In the FLASK framework, there are some ‘@’ statements to define the front-end requests invarious situations (login, display grades, show professor details, etc.) The functions under @ arecalled when the corresponding requests are received. That function in turn submits thecorresponding query to the database and returns the result back to the front-end.In our starter code we use render_template() and request(). render_template() uses Jinja2, a fullfeatured template engine, making this method very powerful because all you need to do is toprovide the HTML template and the variables you want to pass. Jinja2 is inspired by Django’stemplating system but with extension to an expressive language. For the project assignment, thismethod saves you a lot of effort on communicating with front-end and back-end.request(), for access inside the template, is a global object for taking requests from the webpage.We show access of the data in our starter code using the form attribute. For more details of FLASK,here is a link of its docs: http://FLASK.pocoo.org/docs/1.0/.In this project, we recommend PyCharm as the IDE and GitHub as the project management tool.GitHub is required for the purpose of grading. PyCharm installation and basic GitHubconfiguration process are instructed in the corresponding sections, as the self-explained sectiontitles indicate. Finally, in the last section, you use the environment you set up (as described in thetutorial) for exercise. You need to correct the errors in the code and complete a commit-and-push.This whole set-up may take a while to complete for the first-time user, but it is very useful notonly for reducing your effort/workload for the project but also beneficial later in your career.1. Install PythonYou should install Python if you don’t have it installed on your computer. For the operatingsystem that does not have a pre-installed Python package, you may download an installer fromthe Python official website. For our course project, Python with version 3.5+ is recommended.To make sure your Python installation functions properly, open your terminal and type:1. Python3Or, if that does not work, just type:1. PythonHere is what you are expected to see:1. PS C:\Users\431W> python2. Python 3.6.8 (tags/v3.6.8:3c6b436a57, Dec 24 2018, 00:16:47) [MSC v.1916 64 bit (AMD64)] on win323. Type help, copyright, credits or license for more information.4. >>>If you have trouble running the interpreter to check your Python version, please ask us for helpvia Canvas.It is important to confirm that Python is installed on your system. To exit the interactive prompt,you can type:1. exit()and press Enter. On the Mac OS X and Linux versions of Python, you can also press Ctrl + D.On Windows, the exit shortcut is Ctrl + Z, followed by Enter. 2. Install PyCharmPyCharm is an integrated development environment for computer programming, specificallydesigned for the Python programming which are used for our project. PyCharm, supportingPython FLASK web framework along with frontend (client) and SQL (database) support,provides an ideal full-stack IDE for Python. PyCharm is compatible with Windows, MacOS, andLinux. Developed by the Czech company JetBrains, it is eligible for free license with a PennState account.For our project in this course, we recommend using PyCharm to complete your Phase 2implementation. You may choose to use your preferred web development tools on the projectassignment, but it is your own responsibility to make sure you are familiar with the tools youchoose.First, go to https://account.jetbrains.com/signup to register your account with PSU Email. Youneed to remember your password since it is needed during the installation. Please follow theinstructions, go to https://www.jetbrains.com/pycharm/download/ to download the software.It is important to download PyCharm Professional. The machines in the CSE ComputerLabs in Westgate are already equipped with the Professional version.After the installation completed, you shall see the prompt as shown below, when you runPyCharm:*For those who use machines in the lab: you will need to bring your PSU ID card to enter.Also, you need to login with CSE password, which may be different from your Penn StateAccess account. If you need assistance on the account, please go to ITS Help Desk located atW100 Westgate.3. Configure GitHubIf you don’t have a GitHub account, create one first at GitHub.Link your GitHub account to the 431W classroom repository by going to:https://classroom.github.com/a/FugPJ9J7 and link your account to your name on the roster shown in the page. If you do not see your name, please contact the CMPSC431W TAs/LAs viaCanvas immediately.You will see your own private repository with the starter code we proCMPSC 431W作业代做、代写Setup Tutorial作业、代做Python程序设计作业、Python编程作业代vide. This is where yourproject being managed throughout the semester.4. Clone the ProjectNow go back to PyCharm and check out the starter code from your private repository at GitHub:1. Open Settings in PyCharm from the Configure menu, Inthe Settings/Preferences dialog, select Version Control | GitHub in the left pane.Click Add account and type in your credentials.2. Go back to the prompt and Tap Check out from Version Control. Select Git.3. You should be able to see a list of your repositories from GitHub by clicking the arrow.Select the repository for the project we just created.4. Tap Clone and wait until everything is completed. For the first time it may take a while toinstall the packages. You should see a file named app.py ready for you in the editwindow. Note: For windows, git.exe is not preinstalled. If you see the error message“missing git.exe”, follow the instructions to download. You may also need to updatePath to Git executable under Git in your settings, (the path is like C:\ProgramFiles\Git\bin\git.exe).5. From the left click project and select app.py. You should see a starter python code.6. Check if you could run this program first. On the top right, click on the green arrow torun. If you see the arrow gray, right click inside your app.py file and it should configureautomatically. Note: You might need to configure your interpreter as suggested byPyCharm. Follow the instruction and select your installed Python.7. A built-in terminal-like window will show in the bottom, indicating that your project isrunning. Click on the address. For example, it could look like this:8. If you make some changes, you will have to stop and restart the program. You do notcreate a file at this time, but in the future, you must add a new file to your Git when youcreate a program.9. After inserting names, the database has been created under the current directory labeledred. This is normal because it is not added into Git. Your code is supposed to generate acomplete database file(.db).10. Commit and push your code. This is an important step as we only take the code fromGitHub. For your information, commit happens in your local directory, and push is toupload your changes to GitHub.11. One way to commit and push is to click on the green button on the top right at Git, putsome commit message, and select commit and push. Then it will be pushed toorigin/master at your remote repository.12. Double check your repository on github.com. Go to your private repository andspecifically look for the commit message you just entered. You can also check the latestcommit time on the right. 13. Please note that we will use the latest commit time on GitHub as your submission time.You can commit multiple times and push them all before the deadline. For gradingpurpose, we only take your code from master branch. So, do not forget to merge yourbranch back to master if you prefer working on a separate branch.APPENDIXLab W204 Westgate - Setup Information for MySQL and MongoDBMySQL and MongoDB are two well-known and wide-received database management system,which will be used to perform some homework assignments. Moreover, while our project inthis semester does not require you to use them, it’s beneficial to acquire such skills and gainsome experience. The following instructions introduce the steps to connect to the MySQL serverand MongoDB server in Lab W204. Both of MySQL server and MongoDB server have beenconfigured in the host “cse-cmpsc431” which is designate for our course. If you want to useMySQL, you can use computers in Lab W204 to make a connection to the MySQL databaseserver. If you want to use MongoDB in Lab W204, you need to use ssh to login to the host csecmpsc431first, and then use MongoDB in that server. In the following, the setup steps forMySQL and MongoDB are introduced, respectively.MySQL1. After you open the terminal, you can type in:mysql -h cse-cmpsc431 -u -pto build a connection with MySQL database server, where is your psu access id.For example, assume your psu id is abc123, you would enter the following in the terminal:mysql -h cse-cmpsc431 -u abc123 -pand you would then be prompted to enter your mysql password.The initial mysql password is your 9 digit psu ID numbers.2. After you enter the password, you are connected to the MySQL server and see the prompt‘>mysql’ on your terminal. That means you successfully login in your own account in MySQL. To change your password for the MySQL account, please enter:set password = password(‘NewPassword’);where NewPassword is your new password.3. Under the command prompt ‘>mysql’, to see the databases you can enter:show databases;to see the default database of your account. Note that each statement must end with asemicolon(;).4. To choose a database before any action, use the following command:use database_name;where database_name is the name of the database you want to use.5. At last you can enter:quit;to log out your account. And try to log in your account again with your new password.MongoDBTo use MongoDB, you need to use ssh to login to the host cse-cmpsc431. In other words, youmust be in the CSE network, such as in the Lab W204.1. Your first step is to enter:ssh @cse-cmpsc431.cse.psu.eduwhere is your psu access id.For example, assume your psu access id is abc123, you would enter the following in theterminal:ssh [email protected] enter your CSE password and log on the server cse-cmpsc431.2. After that you will need to start the mongo shell as follows: mongo -u -pwhere is the name of default database which is the same with yourpsu access id. And is your psu access id as well.For example, assume your psu id is abc123, you would enter:mongo abc123 -u abc123 -pand then you should be prompted for your MongoDB password which is initially your 9 digitpsu ID numbers.3. In order to change your Mongo Password, you will need to be in the initial database and enterthe following in the Mongo shell:db.changeUserPassword(MongoUserName, NewPassword)For example, you would enter:db.changeUserPassword(abc123, xyz1234)Note in MongoDB there is no ‘;’ at the end in each line. Now you are ready to use MongoDB.Also note that the CSE Home Directories is not mounted on cse-cmpsc431 so when you log intothe MongoDB, you will see a failed write for a .mongorc.js which is typically created in yourhome directory. If CSE Home Directories not be mounted on cse-cmpsc431 is a problem foryour work, please send an email to the TAs and CSE Helpdesk to let us know.转自：http://ass.3daixie.com/2019042422487413.html
