Guided Practice Activities
Django Practice Assessment
Learning Objective: At the end of this activity, a student should:
- Understand the basics of setting up a djanbo-based, python webapp, including your development environment
- Get some experience in searching the web for examples / information on Django-related tasks
- Learn the basics of how the Django database works using models
- Learn how to do basic form manipulation in Django
- Learn how to do basic webapp styling using Bootstrap 4
- Get some exposure to basic unit testing in Django
Step 0: Accept the GitHub Classroom Assignment
Every student should head to https://classroom.github.com/a/PeoZdQ0P to accept the assignment and generate a GitHub repository.
This is an individual assessment - you may not work with anyone else! The purpose is for every student to have their own experience with learning the basics of Django.
Step 1: Complete the Django Tutorial
Everything in this assessment is based around first completing the Django tutorial found at https://docs.djangoproject.com/en/2.1/intro/tutorial01/ . There are seven steps. The first thing you should do is complete all seven steps of the tutorial.
Is the code available online? Of course it is - it's a tutorial. Are you going to learn much by just copy/pasting? Nope. Is that going to hurt you down the road, both in this assessment and in the semester? Absolultely. Play fair and actually do the tutorial.
Note for Windows users: While all of this is certainly possible to do in Windows, I personally (Sherriff) seem to run into random path issues and can get sidetracked when trying to fix them. I had more success when using the built-in Ubuntu environment. Instructions on setting it up can be found at https://tutorials.ubuntu.com/tutorial/tutorial-ubuntu-on-windows . But feel free to use whatever environment you are most comfortable with!
As you are working on the django tutorial, you should be committing and pushing your code up to the GitHub repo you created in Step 0. Please look at this example repo here of another Django project: https://github.com/UVA-CS3240-S19/Staff-TextbookExchange . Specifically notice that the root of this repo is the directory in which you find the
manage.py file in your project. THAT is the directory you should do
git init and
git add * and all the other git setup procedures. If you do not do this correctly, the later steps may not work!!! Make sure this is correct!
Step 2: Adding a Feature
Now, add a new model called "Suggestion" that has a name field and field for the body of text for a suggestion. Create a new view so any user that goes to
/polls/suggestions (such as
http://127.0.0.1:8000/polls/suggestions) can submit a suggestion into the form fields listed above for a new poll (it won't go into the new system automatically - this is just a suggestion!). When the user goes to
/polls/suggestions/list all of the current suggestions should appear on the page. (NOTE: If you did a new app and not a new model, that's okay this time since this was slightly ambiguous. But
/polls/suggestions is what it should have been.)
Step 3: Integrating Bootstrap 4
Now time to make your app look a bit nicer! Specifically the forms. Google for how to integrate Bootstrap 4 into Django. You'll find several examples, along with some that will have info about forms. Use whatever you find, making sure to bookmark the sites and/or writing down the URLs - you'll need to submit them later in the written part of the assignment.
Step 4: Deploy to Heroku
Create an account on Heroku at https://signup.heroku.com .
Follow the instructions at https://devcenter.heroku.com/articles/django-app-configuration to learn how to make your project work on Heroku.
Once you think your project is ready, you can login at https://dashboard.heroku.com/apps and create a new app. Under the Deploy tab, you can connect the GitHub repo for the project. This is why you have to get the project root setup correctly in Step 1! Once you connect the repo, you can scroll down to Deploy Branch on that same page and Heroku will clone your project and put it online! The link can be found in the Settings tab if you can't find it otherwise.
Step 5: Complete the Written Assessment
Complete the Written Assessment found in Student Resources at https://docs.google.com/document/d/1KwsgpZ_am7Xtba7X2iwv2oUBd5bVoB_9jJRQ0LYYYc8/edit and submit to Gradescope.
To earn 5000 XP, you must have the following:
- 3000 XP for a working, customized Django app using Bootstrap running on Heroku
- 1000 XP for a working app
- 1000 XP for Bootstrap integration
- 1000 XP for Heroku deployment
- 2000 XP for the Written Assessment
Written Assessments must be submitted to Gradescope before 2:00 PM on Monday, February 18. GitHub repositories will be locked at the same time.
Submit your final Heroku app link to this Google form: https://goo.gl/forms/QaEsHxxLH06TMySJ2
Guided Practice A - GitHub Tutorial
Your first Guided Practice is to become accustomed to how GitHub works because we will be using it extensively in the class for your projects and for other code submissions.
Learning Objective: At the end of this Guided Practice, a student should: 1) have a basic understanding of how git and GitHub works, 2) know where to go to get more training/information if necessary, and 3) know how to submit assessments for CS 3240 through GitHub and Gradescope.
If you do not have a GitHub account, go to https://github.com and create one first.
Once you have an account, go to https://classroom.github.com/a/biovVhAt and accept the assignment. A repository will be created for you. It will be called
gp-a-yourgithubname and the URL should look like https://github.com/UVA-CS3240-S19/gp-a-yourgithubname.
Then, open the Student Resources folder linked here or on the right-side menu of the course website. In the Guided Practice folder, open "GP-A GitHub Tutorial" and make a copy to your own UVA Google Drive. You will be filling out this sheet as you do this activity and will submit it at the end into Gradescope.
There are several tutorials you should go through if you are not familiar with GitHub. And even then, it's a good idea just to refresh yourself. Don't feel that you have to do all five of these (unless you want to and/or you need to still learn it), but you should at least do one all the way through and glance at a couple others.
- Tutorial 1 - https://try.github.io/levels/1/challenges/1
- Tutorial 2 - https://guides.github.com/activities/hello-world/
- Tutorial 3 - https://rogerdudler.github.io/git-guide/
- Tutorial 4 - https://guides.github.com/introduction/flow/
- Tutorial 5 - https://learngitbranching.js.org/
Fix My Mistakes!
The repository that was created when you accepted the assignment has 4 files in it: 3 POTDs from CS 1110 and README.md.
You need to do the following:
- Create a branch and name it something meaningful
- Correct the mistakes in each program (they are all small, silly things...)
- Commit and push your branch back to GitHub
- Create a pull request with comments to merge the branch
- Merge the branch back into
- Create another new branch
- Create a new
.txtfile (doesn't matter what's in it, but put something there) and add it to the repo
- Make another change to at least one of the
.pyfiles (add comments, etc.)
- Commit the changes locally
- Now change the other
.pyfiles in some way
- Commit the changes again
- Create another pull request with comments to merge the branch
- Merge the branch back into
Don't delete your branches (or anything else with the process). We will be checking these!
When we work with GitHub this semester, we will take the state of your repos at the submission time listed above and use that for grading. There is nothing you need to do specifically in GitHub.
However, you do need to submit your GP-A worksheet into Gradescope. You should have received an email from Gradescope (email@example.com) earlier in the semester with a request to create an account. Go and do that, using your default UVA computing ID email (i.e. firstname.lastname@example.org). Once you have an account, you can go to https://www.gradescope.com/ , find CS 3240, and see the list of assessments ready for submission.
For this Guided Practice, answer the three questions on the "GP-A GitHub Tutorial" worksheet as mentioned above. Limit your answers to just one page. Do not move or change the header on the file (i.e. the boxes where your ID, lab, and name go) beyond just typing your info in.more ...