diff --git a/.github/workflows/deploy.yml b/.github/workflows/deploy.yml index 2e39cbda04b..26085e3df72 100644 --- a/.github/workflows/deploy.yml +++ b/.github/workflows/deploy.yml @@ -1,27 +1,47 @@ +--- name: Build and Deploy + on: push: branches: - master +permissions: + contents: read + pages: write + id-token: write + +concurrency: + group: "pages" + cancel-in-progress: true + jobs: - build-and-deploy: + build: runs-on: ubuntu-latest - if: github.repository == 'djangogirls/tutorial' steps: - name: Checkout - uses: actions/checkout@v2 + uses: actions/checkout@v3 with: persist-credentials: false - - name: Install and Build run: | npm install npx honkit build - - - name: Deploy - uses: JamesIves/github-pages-deploy-action@releases/v3 + - name: Upload artifact + uses: actions/upload-pages-artifact@v1 with: - GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }} - BRANCH: gh-pages - FOLDER: _book + path: _book + + deploy: + needs: build + permissions: + pages: write + id-token: write + environment: + name: github-pages + url: ${{ steps.deployment.outputs.page_url }} + runs-on: ubuntu-latest + steps: + - name: Deploy to GitHub Pages + id: deployment + uses: actions/deploy-pages@v2 diff --git a/en/SUMMARY.md b/en/SUMMARY.md index 453c0d15647..743764ded2e 100644 --- a/en/SUMMARY.md +++ b/en/SUMMARY.md @@ -2,28 +2,82 @@ * [Introduction](README.md) * [Installation](installation/README.md) - * [Installation (RunCode Cloud)](cloud_development_setup/README.md) - * [Installation (Chromebook)](chromebook_setup/README.md) - * [Installation (OS X/Windows/Linux)](installation/README.md#osx-windows-linux) - * [Command Line](installation/README.md#intro-command-line) - * [Python](installation/README.md#python) - * [Code Editor](installation/README.md#code-editor) - * [Virtual Environment](installation/README.md#virtualenv) - * [Django](installation/README.md#django) - * [Git](installation/README.md#git) - * [GitHub](installation/README.md#github-account) - * [PythonAnywhere](installation/README.md#pythonanywhere-account) + * [RunCode Cloud Installation](runcode/README.md) + * [GitHub](runcode/README.md#github) + * [RunCode](runcode/README.md#runcode) + * [Visual Studio Code](runcode/README.md#visual-studio-runcode) + * [PythonAnywhere](runcode/README.md#pythonanywhere) + * [Command Line](runcode/README.md#command-line) + * [Django](runcode/README.md#django) + * [ChromeBook Installation](chromebook/README.md) + * [Cloud IDE](chromebook/README.md#cloud-ide) + * [PaizaCloud Cloud IDE](chromebook/README.md#paizacloud-cloud-ide) + * [AWS Cloud9](chromebook/README.md#aws-cloud9) + * [Glitch.com Cloud IDE](chromebook/README.md#glitch-cloud-ide) + * [Virtual Environment](chromebook/README.md#virtual-environment) + * [GitHub](chromebook/README.md#github) + * [Linux Installation](linux/README.md) + * [Command Line](linux/README.md#intro-command-line) + * [Python](linux/README.md#python) + * [Code Editor](linux/README.md#code-editor) + * [Virtual Environment](linux/README.md#virtualenv) + * [Django](linux/README.md#django) + * [Git](linux/README.md#git) + * [GitHub](linux/README.md#github-account) + * [Mac OSX Installation](macosx/README.md) + * [Command Line](macosx/README.md#intro-command-line) + * [Python](macosx/README.md#python) + * [Code Editor](macosx/README.md#code-editor) + * [Virtual Environment](macosx/README.md#virtualenv) + * [Django](macosx/README.md#django) + * [Git](macosx/README.md#git) + * [GitHub](macosx/README.md#github-account) + * [PythonAnywhere](macosx/README.md#pythonanywhere) + * [Windows Installation](windows/README.md) + * [Command Line](windows/README.md#intro-command-line) + * [Python](windows/README.md#python) + * [Code Editor](windows/README.md#code-editor) + * [Virtual Environment](windows/README.md#virtualenv) + * [Django](windows/README.md#django) + * [Git](windows/README.md#git) + * [GitHub](windows/README.md#github-account) + * [PythonAnywhere](windows/README.md#pythonanywhere-account) * [How the Internet works](how_the_internet_works/README.md) * [Introduction to command line](intro_to_command_line/README.md) -* [Python installation](python_installation/README.md) -* [Code editor](code_editor/README.md) + * [RunCode- Introduction to command line](runcode/intro_to_command_line/README.md) + * [ChromeBook/Linux- Introduction to command line](linux/intro_to_command_line/README.md) + * [Mac OSX - Introduction to command line](macosx/intro_to_command_line/README.md) + * [Windows - Introduction to command line](windows/intro_to_command_line/README.md) +* [Python Installation](python_installation/README.md) + * [ChromeBook/Linux - Python installation](linux/python_installation/README.md) + * [Mac OSX - Python installation](macosx/python_installation/README.md) + * [Windows - Python installation](windows/python_installation/README.md) * [Introduction to Python](python_introduction/README.md) + * [RunCode - Introduction to Python](runcode/python_introduction/README.md) + * [Linux - Introduction to Python](linux/python_introduction/README.md) + * [Mac OSX - Introduction to Python](macosx/python_introduction/README.md) + * [Windows - Introduction to Python](windows/python_introduction/README.md) +* [Code editor](code_editor/README.md) * [What is Django?](django/README.md) -* [Django installation](django_installation/README.md) +* [Django Installation](django_installation/README.md) + * [RunCode - Django installation](runcode/django_installation/README.md) + * [ChromeBook - Django installation](chromebook/README.md#glitch-cloud-ide) + * [Linux - Django installation](linux/django_installation/README.md) + * [Mac OSX - Django installation](macosx/django_installation/README.md) + * [Windows - Django installation](windows/django_installation/README.md) * [Your first Django project!](django_start_project/README.md) + * [RunCode - Your first Django project!](runcode/django_start_project/README.md) + * [ChromeBook - Your first Django project!](chromebook/django_start_project/README.md) + * [Linux - Your first Django project!](linux/django_start_project/README.md) + * [Mac OSX - Your first Django project!](macosx/django_start_project/README.md) + * [Windows - Your first Django project!](windows/django_start_project/README.md) * [Django models](django_models/README.md) * [Django admin](django_admin/README.md) * [Deploy!](deploy/README.md) + * [RunCode - Deploy!](runcode/deploy/README.md) + * [Linux - Deploy!](linux/deploy/README.md) + * [Mac OSX - Deploy!](macosx/deploy/README.md) + * [Windows - Deploy!](windows/deploy/README.md) * [Django URLs](django_urls/README.md) * [Django views – time to create!](django_views/README.md) * [Introduction to HTML](html/README.md) diff --git a/en/chromebook_setup/instructions.md b/en/chromebook/README.md similarity index 71% rename from en/chromebook_setup/instructions.md rename to en/chromebook/README.md index 973e368c6a0..4a9b42bed4a 100644 --- a/en/chromebook_setup/instructions.md +++ b/en/chromebook/README.md @@ -1,19 +1,30 @@ -You can [skip right over this section](http://tutorial.djangogirls.org/en/installation/#install-python) if you're not using a Chromebook. If you -are, your installation experience will be a little different. You can ignore the -rest of the installation instructions. +# Chromebook setup -### Cloud IDE (PaizaCloud Cloud IDE, AWS Cloud9, Glitch.com) +> **Note** If you already worked through the installation steps, no need to do this again – you can skip +straight ahead to [How the Internet works](../how_the_internet_works/README.md). -Cloud IDE is a tool that gives you a code editor and access to a computer running -on the Internet where you can install, write, and run the software. For the duration -of the tutorial, cloud IDE will act as your _local machine_. You'll still be -running commands in a terminal interface just like your classmates on OS X, -Ubuntu, or Windows, but your terminal will be connected to a computer running +# Installation +In this tutorial you will be building a blog. In order to do that, as you go through the tutorial you'll be instructed on how to +set up some online accounts as needed for your ChromeBook. This page gathers all of the sign-up instructions in one place +(which is useful for some workshop formats). + +Since you're working on a ChromeBook, your installation experience is going to be a little different. With a Chromebook, you only +need to create some online accounts. + +Follow the steps below to create the necessary accounts. + +### Cloud IDE (PaizaCloud Cloud IDE, AWS Cloud9, Glitch.com) {#cloud-ide} + +Cloud IDE is a tool that gives you a code editor and access to a computer running +on the Internet where you can install, write, and run the software. For the duration +of the tutorial, cloud IDE will act as your _local machine_. You'll still be +running commands in a terminal interface just like your classmates on OS X, +Ubuntu, or Windows, but your terminal will be connected to a computer running somewhere else that cloud IDE sets up for you. Here are the instructions for cloud IDEs (PaizaCloud Cloud IDE, AWS Cloud9, Glitch.com). You can choose one of the cloud IDEs, and follow the instruction of the cloud IDE. -#### PaizaCloud Cloud IDE +#### PaizaCloud Cloud IDE {#paizacloud-cloud-ide} 1. Go to [PaizaCloud Cloud IDE](https://paiza.cloud/) 2. Sign up for an account @@ -31,14 +42,14 @@ $ The terminal on the PaizaCloud Cloud IDE is prepared for your instructions. You can resize or maximize that window to make it a bit bigger. -#### AWS Cloud9 -Currently Cloud 9 requires you to sign up with AWS and enter credit card +#### AWS Cloud9 {#aws-cloud9} +Currently Cloud 9 requires you to sign up with AWS and enter credit card information. 1. Install Cloud 9 from the [Chrome web store](https://chrome.google.com/webstore/detail/cloud9/nbdmccoknlfggadpfkmcpnamfnbkmkcp) 2. Go to [c9.io](https://c9.io) and click _Get started with AWS Cloud9_ 3. Sign up for an AWS account (requires credit card information, but you can - use it for free) +use it for free) 4. In the AWS Dashboard, enter _Cloud9_ in the search bar and click it 5. In the Cloud 9 dashboard, click _Create environment_ 6. Name it _django-girls_ @@ -57,16 +68,16 @@ text, and a small window at the bottom that looks something like this: yourusername:~/workspace $ ``` -This bottom area is your terminal. You can use the terminal to send instructions -to the remote Cloud 9 computer. You can resize that window to make it a bit -bigger. +This bottom area is your terminal. You can use the terminal to send instructions to the remote Cloud 9 computer. +You can resize that window to make it a bit bigger. -#### Glitch.com Cloud IDE +#### Glitch.com Cloud IDE {#glitch-cloud-ide} 1. Go to [Glitch.com](https://glitch.com/) 2. Sign up for an account (https://glitch.com/signup) or use your GitHub account if you have one. (See GitHub instructions below.) 3. Click _New Project_ and choose _hello-webpage_ -4. Click on the Tools dropdown list (at the bottom left side of the window), then on Terminal button to open terminal tab with a prompt like this: +4. Click on the Tools dropdown list (at the bottom left side of the window), then on Terminal button to open terminal tab with a +prompt like this: {% filename %}Terminal{% endfilename %} ``` @@ -140,17 +151,20 @@ LOGGING = { }, } ``` -This will create a `debug.log` file detailing Django operations and any error messages that might come up, making it much easier to fix if your website does not work. +This will create a `debug.log` file detailing Django operations and any error messages that might come up, making it much easier +to fix if your website does not work. The initial restarting of the Glitch project should fail. -(If you click on the top dropdown button `Show` then click on `In a New Window`, you will receive a `DisallowedHost` error message.) -Do not worry about it at this stage, the tutorial will fix this as soon as you update the Django settings of your project in the `mysite/settings.py` file. +(If you click on the top dropdown button `Show` then click on `In a New Window`, you will receive a `DisallowedHost`error +message.) +Do not worry about it at this stage, the tutorial will fix this as soon as you update the Django settings of your project in the +`mysite/settings.py` file. -### Virtual Environment +### Virtual Environment {#virtual-environment} -A virtual environment (also called a virtualenv) is like a private box we can -stuff useful computer code into for a project we're working on. We use them to -keep the various bits of code we want for our various projects separate so +A virtual environment (also called a virtualenv) is like a private box we can +stuff useful computer code into for a project we're working on. We use them to +keep the various bits of code we want for our various projects separate so things don't get mixed up between projects. Run: @@ -166,22 +180,43 @@ pip install django~={{ book.django_version }} (note that on the last line we use a tilde followed by an equal sign: `~=`). -### GitHub +### GitHub {#github} Make a [GitHub](https://github.com) account. -### PythonAnywhere +### PythonAnywhere {#pythonanywhere} -The Django Girls tutorial includes a section on what is called Deployment, -which is the process of taking the code that powers your new web application -and moving it to a publicly accessible computer (called a server) so other +The Django Girls tutorial includes a section on what is called Deployment, +which is the process of taking the code that powers your new web application +and moving it to a publicly accessible computer (called a server) so other people can see your work. -This part is a little odd when doing the tutorial on a Chromebook since we're +This part is a little odd when doing the tutorial on a Chromebook since we're already using a computer that is on the Internet (as opposed to, say, a laptop). -However, it's still useful, as we can think of our Cloud 9 workspace as a place -for our "in progress" work and Python Anywhere as a place to show off our stuff +However, it's still useful, as we can think of our Cloud 9 workspace as a place +for our "in progress" work and Python Anywhere as a place to show off our stuff as it becomes more complete. Thus, sign up for a new Python Anywhere account at [www.pythonanywhere.com](https://www.pythonanywhere.com). + +{% include "/deploy/signup_pythonanywhere.md" %} + +# Start reading + +Congratulations, you are all set up and ready to go!If you still have some time before the workshop, it would be useful to start reading a +few of the beginning chapters: + +* [How the internet works](../how_the_internet_works/README.md) + +* [Introduction to the command line](../linux/intro_to_command_line/README.md) + +* [Introduction to Python](../linux/python_introduction/README.md) + +* [What is Django?](../django/README.md) + + +# Enjoy the workshop! + +When you begin the workshop, you'll be able to go straight to [Your first Django project!](../linux/django_start_project/README.md) because you +already covered the material in the earlier chapters. diff --git a/en/chromebook/django_start_project/README.md b/en/chromebook/django_start_project/README.md new file mode 100644 index 00000000000..0e0664678ee --- /dev/null +++ b/en/chromebook/django_start_project/README.md @@ -0,0 +1,276 @@ +# Your first Django project! + +> Part of this chapter is based on tutorials by Geek Girls Carrots (https://github.com/ggcarrots/django-carrots). + +> Parts of this chapter are based on the [django-marcador +tutorial](http://django-marcador.keimlink.de/) licensed under the Creative Commons +Attribution-ShareAlike 4.0 International License. The django-marcador tutorial +is copyrighted by Markus Zapke-Gründemann et al. + +We're going to create a small blog! + +The first step is to start a new Django project. Basically, this means that we'll run some scripts provided by Django that will create the +skeleton of a Django project for us. This is just a bunch of directories and files that we will use later. + +The names of some files and directories are very important for Django. You should not rename the files that we are about to create. Moving +them to a different place is also not a good idea. Django needs to maintain a certain structure to be able to find important things. + +> Remember to run everything in the virtualenv. If you don't see a prefix `(myvenv)` in your console, you need to activate your virtualenv. +We explained how to do that in the __Django installation__ chapter in the __Working with virtualenv__ part. Typing +`source myvenv/bin/activate` on Cloud 9 will do this for you. + +In your Cloud 9 console, you should run the following command. +**Don't forget to add the period (or dot) `.` at the end!** + +{% filename %}command-line{% endfilename %} +``` +(myvenv) ~/djangogirls$ django-admin startproject mysite . +``` + +> The period `.` is crucial because it tells the script to install Django in your current directory (for which the period `.` is a short- +hand reference). + +> **Note** When typing the command above, remember that you only type the part which starts by `django-admin`. +The `(myvenv) ~/djangogirls$` part shown here is just example of the prompt that will be inviting your input on your command line. + +`django-admin.py` is a script that will create the directories and files for you. You should now have a directory structure which looks +like this: + +``` +djangogirls +├── manage.py +├── mysite +│   ├── asgi.py +│   ├── __init__.py +│   ├── settings.py +│   ├── urls.py +│   └── wsgi.py +├── myvenv +│   └── ... +└── requirements.txt +``` +> **Note**: in your directory structure, you will also see your `myvenv` directory that we created before. + +`manage.py` is a script that helps with management of the site. With it we will be able (amongst other things) to start a web server on our +computer without installing anything else. + +The `settings.py` file contains the configuration of your website. + +Remember when we talked about a mail carrier checking where to deliver a letter?`urls.py` file contains a list of patterns used by +`urlresolver`. + +Let's ignore the other files for now as we won't change them. The only thing to remember is not to delete them by accident! + + +## Changing settings + +Let's make some changes in `mysite/settings.py`. +Open the file using the code editor you installed earlier. + +**Note**: Keep in mind that `settings.py` is a regular file, like any other. You can open it from inside the code editor, using the "file -> open" +menu actions. This should get you the usual window in which you can navigate to your `settings.py` file and select it. +Alternatively, you can open the file by navigating to the djangogirls folder on your desktop and right-clicking on it. Then, select your +code editor from the list. Selecting the editor is important as you might have other programs installed that can open the file but will not +let you edit it. + +It would be nice to have the correct time on our website. Go to [Wikipedia's list of time zones] +(https://en.wikipedia.org/wiki/List_of_tz_database_time_zones) and copy your relevant time zone (TZ) (e.g. `Europe/Berlin`). + +In `settings.py`, find the line that contains `TIME_ZONE` and modify it to choose your own timezone. For example: + +{% filename %}mysite/settings.py{% endfilename %} +```python +TIME_ZONE = 'Europe/Berlin' +``` + +A language code consist of the language, e.g. `en` for English or `de` for German, and the country code, e.g. `de` for Germany or `ch` for +Switzerland. If English is not your native language, you can add this to change the default buttons and notifications from Django to be in +your language. So you would have "Cancel" button translated into the language you defined here.[Django comes with a lot of prepared +translations](https://docs.djangoproject.com/en/3.2/ref/settings/#language-code). + +If you want a different language, change the language code by changing the following line: + +{% filename %}mysite/settings.py{% endfilename %} +```python +LANGUAGE_CODE = 'de-ch' +``` + + +We'll also need to add a path for static files. (We'll find out all about static files and CSS later in the tutorial.) Go down to the *end* +of the file, and just underneath the `STATIC_URL` entry, add a new one called `STATIC_ROOT`: + +{% filename %}mysite/settings.py{% endfilename %} +```python +STATIC_URL = '/static/' +STATIC_ROOT = BASE_DIR / 'static' +``` + +When `DEBUG` is `True` and `ALLOWED_HOSTS` is empty, the host is validated against `['localhost', '127.0.0.1', '[::1]']`. This won't +match our hostname on PythonAnywhere once we deploy our application so we will change the following setting: + +{% filename %}mysite/settings.py{% endfilename %} +```python +ALLOWED_HOSTS = ['127.0.0.1', '.pythonanywhere.com'] +``` + +> **Note**: If you're using a Chromebook, add this line at the bottom of your settings.py file: +> `MESSAGE_STORAGE = 'django.contrib.messages.storage.session.SessionStorage'` +> +> Also add `.amazonaws.com` to the `ALLOWED_HOSTS` if you are using cloud9 +> +> If you are hosting your project on `Glitch.com`, let us protect the Django secret key that needs to +> remain confidential (otherwise, anyone remixing your project could see it): +> +> * First, we are going to create a random secret key. +> Open the Glitch terminal again, and type the following command: +> +> {% filename %}command-line{% endfilename %} +> ```bash +> python -c 'from django.core.management.utils import get_random_secret_key; \ +> print(get_random_secret_key())' +> ``` +> This should display a long random string, perfect to use as a secret key for your brand new Django web site. +> We will now paste this key into a `.env` file that Glitch will only show you if you are the owner of the web site. +> +> * Create a file `.env` at the root of your project and add the following property in it: +> +> {% filename %}.env{% endfilename %} +> ```bash +> # Here, inside the single quotes, you can cut and paste the random key generated above +> SECRET='3!0k#7ds5mp^-x$lqs2%le6v97h#@xopab&oj5y7d=hxe511jl' +> ``` +> * Then update the Django settings file to inject this secret value and set the Django web site name: +> +> {% filename %}mysite/settings.py{% endfilename %} +> ```python +> import os +> +> SECRET_KEY = os.getenv('SECRET') +> ``` +> * And a little further down in the same file, we inject the name of your new Glitch website: +> +> {% filename %}mysite/settings.py{% endfilename %} +> ```python +> ALLOWED_HOSTS = [os.getenv('PROJECT_DOMAIN') + ".glitch.me"] +> ``` +> The `PROJECT_DOMAIN` value is automatically generated by Glitch. +> It will correspond to the name of your project. + +## Set up a database + +There's a lot of different database software that can store data for your site. We'll use the default one, `sqlite3`. + +This is already set up in this part of your `mysite/settings.py` file: + +{% filename %}mysite/settings.py{% endfilename %} +```python +DATABASES = { + 'default': { + 'ENGINE': 'django.db.backends.sqlite3', + 'NAME': BASE_DIR / 'db.sqlite3', + } +} +``` + +To create a database for our blog, let's run the following in the console:`python manage.py migrate` (we need to be in the `djangogirls` +directory that contains the `manage.py` file). If that goes well, you should see something like this: + +{% filename %}command-line{% endfilename %} +``` +(myvenv) ~/djangogirls$ python manage.py migrate +Operations to perform: + Apply all migrations: admin, auth, contenttypes, sessions +Running migrations: + Applying contenttypes.0001_initial... OK + Applying auth.0001_initial... OK + Applying admin.0001_initial... OK + Applying admin.0002_logentry_remove_auto_add... OK + Applying admin.0003_logentry_add_action_flag_choices... OK + Applying contenttypes.0002_remove_content_type_name... OK + Applying auth.0002_alter_permission_name_max_length... OK + Applying auth.0003_alter_user_email_max_length... OK + Applying auth.0004_alter_user_username_opts... OK + Applying auth.0005_alter_user_last_login_null... OK + Applying auth.0006_require_contenttypes_0002... OK + Applying auth.0007_alter_validators_add_error_messages... OK + Applying auth.0008_alter_user_username_max_length... OK + Applying auth.0009_alter_user_last_name_max_length... OK + Applying auth.0010_alter_group_name_max_length... OK + Applying auth.0011_update_proxy_permissions... OK + Applying auth.0012_alter_user_first_name_max_length... OK + Applying sessions.0001_initial... OK +``` + +And we're done! Time to start the web server and see if our website is working! + +## Starting the web server + +You need to be in the directory that contains the `manage.py` file (the `djangogirls` directory). In the console, we can start the web +server by running `python manage.py runserver`: + +{% filename %}command-line{% endfilename %} +``` +(myvenv) ~/djangogirls$ python manage.py runserver +``` + +If you are on a Chromebook, use this command instead: + +{% filename %}Cloud 9{% endfilename %} +``` +(myvenv) ~/djangogirls$ python manage.py runserver 0.0.0.0:8080 +``` +or this one if you are using Glitch: + +{% filename %}Glitch.com terminal{% endfilename %} +``` +$ refresh + +``` + +If you are on Windows and this fails with `UnicodeDecodeError`, use this command instead: + +{% filename %}command-line{% endfilename %} +``` +(myvenv) ~/djangogirls$ python manage.py runserver 0:8000 +``` + + +Now you need to check that your website is running. Open your browser (Firefox, Chrome, Safari, Internet Explorer or +whatever you use) and enter this address: + +{% filename %}browser{% endfilename %} +``` +http://127.0.0.1:8000/ +``` + +If you're using a Chromebook and Cloud9, instead click the URL in the pop-up window that should have appeared in the +upper right corner of the command window where the web server is running. +The URL will look something like: + +{% filename %}browser{% endfilename %} +``` +https://.vfs.cloud9.us-west-2.amazonaws.com +``` +or on Glitch: +``` +https://name-of-your-glitch-project.glitch.me +``` + +You can open this in another browser window and you should see the Django install worked page. + +Congratulations! You've just created your first website and run it using a web server! Isn't that awesome? + +![Install worked!](images/install_worked.png) + +Note that a command window can only run one thing at a time, and the command window you opened earlier is running the web server. As long +as the web server is running and waiting for additional incoming requests, the terminal will accept new text but will not execute new +commands. + +> We reviewed how web servers work in the How the Internet works chapter. + +To type additional commands while the web server is running, open a new terminal window and activate your virtualenv -- to review +instructions on how to open a second terminal window, see [Introduction to the command line](../intro_to_command_line/README.md). To stop +the web server, switch back to the window in which it's running and press CTRL+C - Control and C keys together (on Windows, you might have +to press Ctrl+Break). + +Ready for the next step? It's time to create some content! diff --git a/en/django_start_project/images/install_worked.png b/en/chromebook/django_start_project/images/install_worked.png similarity index 100% rename from en/django_start_project/images/install_worked.png rename to en/chromebook/django_start_project/images/install_worked.png diff --git a/en/chromebook_setup/README.md b/en/chromebook_setup/README.md deleted file mode 100644 index cadeff050a0..00000000000 --- a/en/chromebook_setup/README.md +++ /dev/null @@ -1,5 +0,0 @@ -# Chromebook setup - -> **Note** If you already worked through the [installation steps](../installation/README.md), no need to do this again – you can skip straight ahead to [Introduction to Python](../python_introduction/README.md). - -{% include "/chromebook_setup/instructions.md" %} diff --git a/en/cloud_development_setup/README.md b/en/cloud_development_setup/README.md deleted file mode 100644 index 6ac43a58741..00000000000 --- a/en/cloud_development_setup/README.md +++ /dev/null @@ -1,5 +0,0 @@ -# RunCode Cloud Environment setup - -> **Note** If you already worked through the [installation steps](../installation/README.md), you do not need to also complete the RunCode Cloud Environment setup. Please skip straight to [Introduction to Python](../python_introduction/README.md). - -{% include "/cloud_development_setup/instructions.md" %} \ No newline at end of file diff --git a/en/code_editor/README.md b/en/code_editor/README.md index 03694b61ca2..249c09c66f7 100644 --- a/en/code_editor/README.md +++ b/en/code_editor/README.md @@ -4,10 +4,8 @@ You're about to write your first line of code, so it's time to download a code editor! -> **Note** If you're using a Chromebook, skip this chapter and make sure you follow the [Chromebook Setup](../chromebook_setup/README.md) instructions. The cloud IDE you chose (PaizaCloud Cloud IDE or AWS Cloud9) includes a code editor, and when you open a file in your IDE from the File menu, you will automatically be using the editor. - -> **Note** You might have done this earlier in the [Installation chapter](../installation/README.md) – if so, you can skip right ahead to the next chapter! - -> **Note** If you have followed [RunCode Setup](../cloud_development_setup/README.md) you can skip this section as Visual Studio Code is pre-installed on the platform. +> **Note** You might have done this earlier in the [Installation chapter](../installation/README.md) – if so, you can skip right ahead to the next chapter! +> +> **Note** If you are coding on RunCode, this step is not necessary as Visual Studio Code is pre-installed on RunCode - if so you can skip right ahead to the next chapter! {% include "/code_editor/instructions.md" %} diff --git a/en/deploy/README.md b/en/deploy/README.md index fbc01880e53..d337642f572 100644 --- a/en/deploy/README.md +++ b/en/deploy/README.md @@ -1,184 +1,7 @@ # Deploy! -> **Note** The following chapter can be sometimes a bit hard to get through. Persist and finish it; deployment is an important part of the website development process. This chapter is placed in the middle of the tutorial so that your mentor can help with the slightly trickier process of getting your website online. This means you can still finish the tutorial on your own if you run out of time. - -Until now, your website was only available on your computer. Now you will learn how to deploy it! Deploying is the process of publishing your application on the Internet so people can finally go and see your app. :) - -As you learned, a website has to be located on a server. There are a lot of server providers available on the internet, we're going to use [PythonAnywhere](https://www.pythonanywhere.com/). PythonAnywhere is free for small applications that don't have too many visitors so it'll definitely be enough for you now. - -The other external service we'll be using is [GitHub](https://www.github.com), which is a code hosting service. There are others out there, but almost all programmers have a GitHub account these days, and now so will you! - -These three places will be important to you. Your local computer will be the place where you do development and testing. When you're happy with the changes, you will place a copy of your program on GitHub. Your website will be on PythonAnywhere and you will update it by getting a new copy of your code from GitHub. - -# Git - -> **Note** If you already did the [installation steps](../installation/README.md), there's no need to do this again – you can skip to the next section and start creating your Git repository. - -{% include "/deploy/install_git.md" %} - -## Starting our Git repository - -Git tracks changes to a particular set of files in what's called a code repository (or "repo" for short). Let's start one for our project. Open up your console and run these commands, in the `djangogirls` directory: - -> **Note** Check your current working directory with a `pwd` (Mac OS X/Linux) or `cd` (Windows) command before initializing the repository. You should be in the `djangogirls` folder. - -{% filename %}command-line{% endfilename %} -``` -$ git init -Initialized empty Git repository in ~/djangogirls/.git/ -$ git config --global user.name "Your Name" -$ git config --global user.email you@example.com -``` -Initializing the git repository is something we need to do only once per project (and you won't have to re-enter the username and email ever again). - -### Adjusting your branch name - -If the version of Git that you are using is older than **2.28**, you will need to change the name of your branch to "main". To determine the version of Git, please enter the following command: - -{% filename %}command-line{% endfilename %} -``` -$ git --version -git version 2.xx... -``` - -Only if the second number of the version, shown as "xx" above, is less than 28, will you need to enter the following command to rename your branch. If it is 28 or higher, please continue to "Ignoring files". As in "Initializing", this is something we need to do only once per project, as well as only when your version of Git is less than 2.28: - -{% filename %}command-line{% endfilename %} -``` -$ git branch -M main -``` - -### Ignoring files - -Git will track changes to all the files and folders in this directory, but there are some files we want it to ignore. We do this by creating a file called `.gitignore` in the base directory. Open up your editor and create a new file with the following contents: - -{% filename %}.gitignore{% endfilename %} -``` -# Python -*.pyc -*~ -__pycache__ - -# Env -.env -myvenv/ -venv/ - -# Database -db.sqlite3 - -# Static folder at project root -/static/ - -# macOS -._* -.DS_Store -.fseventsd -.Spotlight-V100 - -# Windows -Thumbs.db* -ehthumbs*.db -[Dd]esktop.ini -$RECYCLE.BIN/ - -# Visual Studio -.vscode/ -.history/ -*.code-workspace -``` - -And save it as `.gitignore` in the "djangogirls" folder. - -> **Note** The dot at the beginning of the file name is important! If you're having any difficulty creating it (Macs don't like you to create files that begin with a dot via the Finder, for example), then use the "Save As" feature in your editor; it's bulletproof. And be sure not to add `.txt`, `.py`, or any other extension to the file name -- it will only be recognized by Git if the name is just `.gitignore`. -Linux and MacOS treat files with a name that starts with `.` (such as `.gitignore`) as hidden -and the normal `ls` command won't show these files. -Instead use `ls -a` to see the `.gitignore` file. - -> **Note** One of the files you specified in your `.gitignore` file is `db.sqlite3`. That file is your local database, where all of your users and posts are stored. We'll follow standard web programming practice, meaning that we'll use separate databases for your local testing site and your live website on PythonAnywhere. The PythonAnywhere database could be SQLite, like your development machine, but usually you will use one called MySQL which can deal with a lot more site visitors than SQLite. Either way, by ignoring your SQLite database for the GitHub copy, it means that all of the posts and superuser you created so far are going to only be available locally, and you'll have to create new ones on production. You should think of your local database as a good playground where you can test different things and not be afraid that you're going to delete your real posts from your blog. - -It's a good idea to use a `git status` command before `git add` or whenever you find yourself unsure of what has changed. This will help prevent any surprises from happening, such as wrong files being added or committed. The `git status` command returns information about any untracked/modified/staged files, the branch status, and much more. The output should be similar to the following: - -{% filename %}command-line{% endfilename %} -``` -$ git status -On branch main - -No commits yet - -Untracked files: - (use "git add ..." to include in what will be committed) - - .gitignore - blog/ - manage.py - mysite/ - requirements.txt - -nothing added to commit but untracked files present (use "git add" to track) -``` - -And finally we save our changes. Go to your console and run these commands: - -{% filename %}command-line{% endfilename %} -``` -$ git add . -$ git commit -m "My Django Girls app, first commit" - [...] - 13 files changed, 200 insertions(+) - create mode 100644 .gitignore - [...] - create mode 100644 mysite/wsgi.py -``` - - -## Pushing your code to GitHub - -Go to [GitHub.com](https://www.github.com) and sign up for a new, free user account. (If you already did that in the workshop prep, that is great!) Be sure to remember your password (add it to your password manager, if you use one). - -Then, create a new repository, giving it the name "my-first-blog". Leave the "initialize with a README" checkbox unchecked, leave the .gitignore option blank (we've done that manually) and leave the License as None. - -![](images/new_github_repo.png) - -> **Note** The name `my-first-blog` is important – you could choose something else, but it's going to occur lots of times in the instructions below, and you'd have to substitute it each time. It's probably easier to stick with the name `my-first-blog`. - -On the next screen, you'll be shown your repo's clone URL, which you will use in some of the commands that follow: - -![](images/github_get_repo_url_screenshot.png) - -Now we need to hook up the Git repository on your computer to the one up on GitHub. - -Type the following into your console (replace `` with the username you entered when you created your GitHub account, but without the angle-brackets -- the URL should match the clone URL you just saw). - -{% filename %}command-line{% endfilename %} -``` -$ git remote add origin https://github.com//my-first-blog.git -$ git push -u origin main -``` - -When you push to GitHub, you'll be asked for your GitHub username and password (either right there in the command-line window or in a pop-up window), and after entering credentials you should see something like this: - -{% filename %}command-line{% endfilename %} -``` -Counting objects: 6, done. -Writing objects: 100% (6/6), 200 bytes | 0 bytes/s, done. -Total 3 (delta 0), reused 0 (delta 0) -To https://github.com/ola/my-first-blog.git - * [new branch] main -> main -Branch main set up to track remote branch main from origin. -``` - - - -Your code is now on GitHub. Go and check it out! You'll find it's in fine company – [Django](https://github.com/django/django), the [Django Girls Tutorial](https://github.com/DjangoGirls/tutorial), and many other great open source software projects also host their code on GitHub. :) - -{% include "/deploy/pythonanywhere.md" %} - -# Check out your site! - -The default page for your site should say "It worked!", just like it does on your local computer. Try adding `/admin/` to the end of the URL, and you'll be taken to the admin site. Log in with the username and password, and you'll see you can add new Posts on the server -- remember, the posts from your local test database were not sent to your live blog. - -Once you have a few posts created, you can go back to your local setup (not PythonAnywhere). From here you should work on your local setup to make changes. This is a common workflow in web development – make changes locally, push those changes to GitHub, and pull your changes down to your live Web server. This allows you to work and experiment without breaking your live Web site. Pretty cool, huh? - - -Give yourself a *HUGE* pat on the back! Server deployments are one of the trickiest parts of web development and it often takes people several days before they get them working. But you've got your site live, on the real Internet! +To continue, pick your platform/operating system: +* [RunCode Cloud](../runcode/deploy/README.md) +* [ChromeBook/Linux](../linux/deploy/README.md) +* [Mac OSX](../macosx/deploy/README.md) +* [Windows](../windows/deploy/README.md) \ No newline at end of file diff --git a/en/django_installation/README.md b/en/django_installation/README.md index de8abc08a06..0dfd57dfd87 100644 --- a/en/django_installation/README.md +++ b/en/django_installation/README.md @@ -1,9 +1,8 @@ # Django installation -> **Note** If you're using a Chromebook, skip this chapter and make sure you follow the [Chromebook Setup](../chromebook_setup/README.md) instructions. - -> **Note** If you're using RunCode, skip this chapter and make sure you follow the [RunCode Setup](../cloud_development_setup/README.md) instructions. - -> **Note** If you already worked through the [installation steps](../installation/README.md) then you've already done this – you can go straight to the next chapter! - -{% include "/django_installation/instructions.md" %} +To continue, pick your platform/operating system: +* [RunCode Cloud](../runcode/django_installation/README.md) +* [ChromeBook](../chromebook/README.md#glitch-cloud-ide) +* [Linux](../linux/django_installation/README.md) +* [Mac OSX](../macosx/django_installation/README.md) +* [Windows](../windows/django_installation/README.md) \ No newline at end of file diff --git a/en/django_start_project/README.md b/en/django_start_project/README.md index ce1ef96ca0c..f4d54240161 100644 --- a/en/django_start_project/README.md +++ b/en/django_start_project/README.md @@ -1,274 +1,8 @@ # Your first Django project! -> Part of this chapter is based on tutorials by Geek Girls Carrots (https://github.com/ggcarrots/django-carrots). - -> Parts of this chapter are based on the [django-marcador -tutorial](http://django-marcador.keimlink.de/) licensed under the Creative Commons -Attribution-ShareAlike 4.0 International License. The django-marcador tutorial -is copyrighted by Markus Zapke-Gründemann et al. - -We're going to create a small blog! - -The first step is to start a new Django project. Basically, this means that we'll run some scripts provided by Django that will create the skeleton of a Django project for us. This is just a bunch of directories and files that we will use later. - -The names of some files and directories are very important for Django. You should not rename the files that we are about to create. Moving them to a different place is also not a good idea. Django needs to maintain a certain structure to be able to find important things. - -> Remember to run everything in the virtualenv. If you don't see a prefix `(myvenv)` in your console, you need to activate your virtualenv. We explained how to do that in the __Django installation__ chapter in the __Working with virtualenv__ part. Typing `myvenv\Scripts\activate` on Windows or -`source myvenv/bin/activate` on Mac OS X or Linux will do this for you. - - - -In your Mac OS X or Linux console, you should run the following command. **Don't forget to add the period (or dot) `.` at the end!** - -{% filename %}command-line{% endfilename %} -``` -(myvenv) ~/djangogirls$ django-admin startproject mysite . -``` - -> The period `.` is crucial because it tells the script to install Django in your current directory (for which the period `.` is a short-hand reference). - -> **Note** When typing the command above, remember that you only type the part which starts by `django-admin`. -The `(myvenv) ~/djangogirls$` part shown here is just example of the prompt that will be inviting your input on your command line. - - - - - -On Windows you should run the following command. **(Don't forget to add the period (or dot) `.` at the end)**: - -{% filename %}command-line{% endfilename %} -``` -(myvenv) C:\Users\Name\djangogirls> django-admin.exe startproject mysite . -``` -> The period `.` is crucial because it tells the script to install Django in your current directory (for which the period `.` is a short-hand reference). - -> **Note** When typing the command above, remember that you only type the part which starts by `django-admin.exe`. -The `(myvenv) C:\Users\Name\djangogirls>` part shown here is just example of the prompt that will be inviting your input on your command line. - - - -`django-admin.py` is a script that will create the directories and files for you. You should now have a directory structure which looks like this: - -``` -djangogirls -├── manage.py -├── mysite -│   ├── asgi.py -│   ├── __init__.py -│   ├── settings.py -│   ├── urls.py -│   └── wsgi.py -├── myvenv -│   └── ... -└── requirements.txt -``` -> **Note**: in your directory structure, you will also see your `myvenv` directory that we created before. - -`manage.py` is a script that helps with management of the site. With it we will be able (amongst other things) to start a web server on our computer without installing anything else. - -The `settings.py` file contains the configuration of your website. - -Remember when we talked about a mail carrier checking where to deliver a letter? `urls.py` file contains a list of patterns used by `urlresolver`. - -Let's ignore the other files for now as we won't change them. The only thing to remember is not to delete them by accident! - - -## Changing settings - -Let's make some changes in `mysite/settings.py`. Open the file using the code editor you installed earlier. - -**Note**: Keep in mind that `settings.py` is a regular file, like any other. You can open it from inside the code editor, using the "file -> open" menu actions. This should get you the usual window in which you can navigate to your `settings.py` file and select it. Alternatively, you can open the file by navigating to the djangogirls folder on your desktop and right-clicking on it. Then, select your code editor from the list. Selecting the editor is important as you might have other programs installed that can open the file but will not let you edit it. - -It would be nice to have the correct time on our website. Go to [Wikipedia's list of time zones](https://en.wikipedia.org/wiki/List_of_tz_database_time_zones) and copy your relevant time zone (TZ) (e.g. `Europe/Berlin`). - -In `settings.py`, find the line that contains `TIME_ZONE` and modify it to choose your own timezone. For example: - -{% filename %}mysite/settings.py{% endfilename %} -```python -TIME_ZONE = 'Europe/Berlin' -``` - -A language code consist of the language, e.g. `en` for English or `de` for German, and the country code, e.g. `de` for Germany or `ch` for Switzerland. If English is not your native language, you can add this to change the default buttons and notifications from Django to be in your language. So you would have "Cancel" button translated into the language you defined here. [Django comes with a lot of prepared translations](https://docs.djangoproject.com/en/3.2/ref/settings/#language-code). - -If you want a different language, change the language code by changing the following line: - -{% filename %}mysite/settings.py{% endfilename %} -```python -LANGUAGE_CODE = 'de-ch' -``` - - -We'll also need to add a path for static files. (We'll find out all about static files and CSS later in the tutorial.) Go down to the *end* of the file, and just underneath the `STATIC_URL` entry, add a new one called `STATIC_ROOT`: - -{% filename %}mysite/settings.py{% endfilename %} -```python -STATIC_URL = '/static/' -STATIC_ROOT = BASE_DIR / 'static' -``` - -When `DEBUG` is `True` and `ALLOWED_HOSTS` is empty, the host is validated against `['localhost', '127.0.0.1', '[::1]']`. This won't -match our hostname on PythonAnywhere once we deploy our application so we will change the following setting: - -{% filename %}mysite/settings.py{% endfilename %} -```python -ALLOWED_HOSTS = ['127.0.0.1', '.pythonanywhere.com'] -``` - -> **Note**: If you're using a Chromebook, add this line at the bottom of your settings.py file: -> `MESSAGE_STORAGE = 'django.contrib.messages.storage.session.SessionStorage'` - -> Also add `.amazonaws.com` to the `ALLOWED_HOSTS` if you are using cloud9 - -> If you are hosting your project on `Glitch.com`, let us protect the Django secret key that needs to -> remain confidential (otherwise, anyone remixing your project could see it): -> -> * First, we are going to create a random secret key. -> Open the Glitch terminal again, and type the following command: -> -> {% filename %}command-line{% endfilename %} -> ```bash -> python -c 'from django.core.management.utils import get_random_secret_key; \ -> print(get_random_secret_key())' -> ``` -> This should display a long random string, perfect to use as a secret key for your brand new Django web site. -> We will now paste this key into a `.env` file that Glitch will only show you if you are the owner of the web site. -> -> * Create a file `.env` at the root of your project and add the following property in it: -> -> {% filename %}.env{% endfilename %} -> ```bash -> # Here, inside the single quotes, you can cut and paste the random key generated above -> SECRET='3!0k#7ds5mp^-x$lqs2%le6v97h#@xopab&oj5y7d=hxe511jl' -> ``` -> * Then update the Django settings file to inject this secret value and set the Django web site name: -> -> {% filename %}mysite/settings.py{% endfilename %} -> ```python -> import os -> -> SECRET_KEY = os.getenv('SECRET') -> ``` -> * And a little further down in the same file, we inject the name of your new Glitch website: -> -> {% filename %}mysite/settings.py{% endfilename %} -> ```python -> ALLOWED_HOSTS = [os.getenv('PROJECT_DOMAIN') + ".glitch.me"] -> ``` -> The `PROJECT_DOMAIN` value is automatically generated by Glitch. -> It will correspond to the name of your project. - -## Set up a database - -There's a lot of different database software that can store data for your site. We'll use the default one, `sqlite3`. - -This is already set up in this part of your `mysite/settings.py` file: - -{% filename %}mysite/settings.py{% endfilename %} -```python -DATABASES = { - 'default': { - 'ENGINE': 'django.db.backends.sqlite3', - 'NAME': BASE_DIR / 'db.sqlite3', - } -} -``` - -To create a database for our blog, let's run the following in the console: `python manage.py migrate` (we need to be in the `djangogirls` directory that contains the `manage.py` file). If that goes well, you should see something like this: - -{% filename %}command-line{% endfilename %} -``` -(myvenv) ~/djangogirls$ python manage.py migrate -Operations to perform: - Apply all migrations: admin, auth, contenttypes, sessions -Running migrations: - Applying contenttypes.0001_initial... OK - Applying auth.0001_initial... OK - Applying admin.0001_initial... OK - Applying admin.0002_logentry_remove_auto_add... OK - Applying admin.0003_logentry_add_action_flag_choices... OK - Applying contenttypes.0002_remove_content_type_name... OK - Applying auth.0002_alter_permission_name_max_length... OK - Applying auth.0003_alter_user_email_max_length... OK - Applying auth.0004_alter_user_username_opts... OK - Applying auth.0005_alter_user_last_login_null... OK - Applying auth.0006_require_contenttypes_0002... OK - Applying auth.0007_alter_validators_add_error_messages... OK - Applying auth.0008_alter_user_username_max_length... OK - Applying auth.0009_alter_user_last_name_max_length... OK - Applying auth.0010_alter_group_name_max_length... OK - Applying auth.0011_update_proxy_permissions... OK - Applying auth.0012_alter_user_first_name_max_length... OK - Applying sessions.0001_initial... OK -``` - -And we're done! Time to start the web server and see if our website is working! - -## Starting the web server - -You need to be in the directory that contains the `manage.py` file (the `djangogirls` directory). In the console, we can start the web server by running `python manage.py runserver`: - -{% filename %}command-line{% endfilename %} -``` -(myvenv) ~/djangogirls$ python manage.py runserver -``` - -If you are on a Chromebook, use this command instead: - -{% filename %}Cloud 9{% endfilename %} -``` -(myvenv) ~/djangogirls$ python manage.py runserver 0.0.0.0:8080 -``` -or this one if you are using Glitch: - -{% filename %}Glitch.com terminal{% endfilename %} -``` -$ refresh - -``` - -If you are on Windows and this fails with `UnicodeDecodeError`, use this command instead: - -{% filename %}command-line{% endfilename %} -``` -(myvenv) ~/djangogirls$ python manage.py runserver 0:8000 -``` - - -Now you need to check that your website is running. Open your browser (Firefox, Chrome, Safari, Internet Explorer or whatever you use) and enter this address: - -{% filename %}browser{% endfilename %} -``` -http://127.0.0.1:8000/ -``` - -If you're using a Chromebook and Cloud9, instead click the URL in the pop-up window that should have appeared in the upper right corner of the command window where the web server is running. The URL will look something like: - -{% filename %}browser{% endfilename %} -``` -https://.vfs.cloud9.us-west-2.amazonaws.com -``` -or on Glitch: -``` -https://name-of-your-glitch-project.glitch.me -``` - -If you are using RunCode cloud platform, the URL will look something like this: -`https://8000-soft-limit-18855079.eu-ws4.runcode.io/`. To view your own instance, the URL will be like: - -{% filename %}browser{% endfilename %} -``` -https://8000-the-name-of-your-runcode-instance.eu-ws4.runcode.io/ -``` -You can open this in another browser window and you should see the Django install worked page. - -Congratulations! You've just created your first website and run it using a web server! Isn't that awesome? - -![Install worked!](images/install_worked.png) - -Note that a command window can only run one thing at a time, and the command window you opened earlier is running the web server. As long as the web server is running and waiting for additional incoming requests, the terminal will accept new text but will not execute new commands. - -> We reviewed how web servers work in the How the Internet works chapter. - -To type additional commands while the web server is running, open a new terminal window and activate your virtualenv -- to review instructions on how to open a second terminal window, see [Introduction to the command line](../intro_to_command_line/README.md). To stop the web server, switch back to the window in which it's running and press CTRL+C - Control and C keys together (on Windows, you might have to press Ctrl+Break). - -Ready for the next step? It's time to create some content! +To continue, pick your platform/operating system: +* [RunCode Cloud](../runcode/django_start_project/README.md) +* [ChromeBook](../chromebook/django_start_project/README.md) +* [Linux](../linux/django_start_project/README.md) +* [Mac OSX](../macosx/django_start_project/README.md) +* [Windows](../windows/django_start_project/README.md) \ No newline at end of file diff --git a/en/installation/README.md b/en/installation/README.md index cf171ef63e1..19d606fd54d 100644 --- a/en/installation/README.md +++ b/en/installation/README.md @@ -1,90 +1,63 @@ # If you're doing the tutorial at home -If you're doing the tutorial at home, not at one of the [Django Girls events](https://djangogirls.org/events/), you can completely skip this chapter now and go straight to the [How the Internet works](../how_the_internet_works/README.md) chapter. +If you're doing the tutorial at home, not at one of the [Django Girls events](https://djangogirls.org/events/), you can completely +skip this chapter now and go straight to the [How the Internet works](../how_the_internet_works/README.md) chapter. -This is because we cover installing things as they are needed in the tutorial -- this is just an additional page that gathers all of the installation instructions in one place (which is useful for some workshop formats). You can choose to install everything that is on this page right now if you wish. But if you want to start learning things before installing a bunch of stuff on your computer, skip this chapter and we will explain the installation parts to you later on, as they are needed. +This is because we cover installing things as they are needed in the tutorial -- this is just an additional page that gathers all +of the installation instructions in one place (which is useful for some workshop formats). You can choose to install everything +that is on this page right now if you wish. But if you want to start learning things before installing a bunch of stuff on your +computer, skip this chapter and we will explain the installation parts to you later on, as they are needed. Good luck! # If you're attending a workshop If you are attending one of the [Django Girls events](https://djangogirls.org/events/): -- Your workshop may have an "installation party" before the main workshop. If you are at an installation party, this page is for you! Follow the instructions here to get everything you need for the workshop installed, with the help of the coaches if needed. Then at the main workshop, you'll be able to skip installation instructions you'll encounter in the main tutorial when you get to them. -- The organizers of your workshop may have asked you to try at home to install everything on your computer before the workshop starts. If you have been asked to do that, this page is for you! Follow the instructions here, as best you can. Then at the main workshop, when you get to an installation step in the main tutorial, if you were not able to get that piece installed you can get help from your coach. -- If your workshop does not have an installation party (or you couldn't attend), and if the organizers didn't ask you to try to install everything before you arrived, skip this page and go straight to the [How the Internet works](../how_the_internet_works/README.md) chapter. You'll be installing everything you need as you work through the tutorial. +- Your workshop may have an "installation party" before the main workshop. If you are at an installation party, this page is for + you! Follow the instructions here to get everything you need for the workshop installed, with the help of the coaches if needed. + Then at the main workshop, you'll be able to skip installation instructions you'll encounter in the main tutorial when you get to + them. +- The organizers of your workshop may have asked you to try at home to install everything on your computer before the workshop + starts. If you have been asked to do that, this page is for you! Follow the instructions here, as best you can. Then at the main + workshop, when you get to an installation step in the main tutorial, if you were not able to get that piece installed you can get + help from your coach. +- If your workshop does not have an installation party (or you couldn't attend), and if the organizers didn't ask you to try to + install everything before you arrived, skip this page and go straight to the [How the Internet works](../how_the_internet_works/README.md) + chapter. You'll be installing everything you need as you work through the tutorial. # Installation -In this tutorial you will be building a blog. In order to do that, as you go through the tutorial you'll be instructed on how to -install various software on your computer and set up some online accounts as needed (if you are using local desktop environment) or instructed on how to create online accounts only (if you are using cloud development). This page gathers all of the installation and sign-up instructions in one place (which is useful for some workshop formats). +In this tutorial you will be building a blog. In order to do that, as you go through the tutorial you'll be instructed on how to +install various software on your computer and set up some online accounts as needed (if you are using local desktop environment) or +instructed on how to create online accounts only (if you are using cloud development). This page presents you with available choices +of development environments and let's you choose which operating system/platform you would like to use. # Cloud Development -In this tutorial, the cloud development platform we will be using will be [RunCode](https://runcode.io/). RunCode is a cloud development environment which people can use without the need to install Python, Django and Visual Studio Code editor locally on their machines. This cloud environment enables anyone to work from any device that has an internet connection, including cellphones, tablets, laptop or desktop. - -This removes the need for you to install packages on a borrowed laptop or the need for you to own a laptop to attend the workshop or follow this tutorial from home as you only need to set up three online accounts. This will also save you time required for setting up your development environment. You can always do the [installation](installation/README.md#command-line) later own as a follow-up after finishing the tutorial. However, loading the development enviroment requires good and fast internet for this solution to work for you. - -> **Note** There are sections of this tutorial which depend on the platform you are working on. If you follow the local installation steps for Windows, Linux, OS X or Chromebook, you will need to follow instructions for your operating system. If you follow RunCode Cloud Environment setup instructions, then you will need to follow instructions for RunCode development environment. Where no specific instructions are provided for RunCode Cloud Environment, follow the Linux instructions as RunCode runs on Ubuntu Linux. - - -# RunCode Cloud Development Setup -To set up RunCode Cloud development, follow the instructions below: - - -{% include "/cloud_development_setup/instructions.md" %} - - -# Chromebook Installation -To set up your Chromebook, follow the instructions below: - - -{% include "/chromebook_setup/instructions.md" %} - - - -# OS X, Windows, Linux Installation {#osx-windows-linux} -> __NOTE:__ You can skip right over this section if you have followed [RunCode Cloud Development](cloud_development_setup/README.md) or [ChromeBook](chromebook_setup/README.md) installation steps. - -If you are not using RunCode or Chromebook, your experience will be a little different as you need to download and install some software locally as well as set up online accounts. - -To install software on your machine, follow the instructions below: - -## Brief intro to the command line {#intro-command-line} -Many of the steps below reference the "console", "terminal", "command window", or "command line" -- these all mean the same thing: a window on your computer where you can enter commands. When you get to the main tutorial, you'll learn more about the command line. For now, the main thing you need to know is how to open a command window and what it looks like: -{% include "/intro_to_command_line/open_instructions.md" %} - -## Install Python {#python} -{% include "/python_installation/instructions.md" %} - -## Install a code editor {#code-editor} -{% include "/code_editor/instructions.md" %} - -## Set up virtualenv and install Django {#virtualenv} -{% include "/django_installation/instructions.md" %} - -## Install Git {#git} -{% include "/deploy/install_git.md" %} - -## Create a GitHub account {#github-account} -Go to [GitHub.com](https://www.github.com) and sign up for a new, free user account. Be sure to remember your password (add it to your password manager, if you use one). - -## Create a PythonAnywhere account {#pythonanywhere-account} -{% include "/deploy/signup_pythonanywhere.md" %} - - -# Start reading - -Congratulations, you are all set up and ready to go! If you still have some time before the workshop, it would be useful to start reading a few of the beginning chapters: - -* [How the internet works](../how_the_internet_works/README.md) - -* [Introduction to the command line](../intro_to_command_line/README.md) - -* [Introduction to Python](../python_introduction/README.md) - -* [What is Django?](../django/README.md) - - -# Enjoy the workshop! - -When you begin the workshop, you'll be able to go straight to [Your first Django project!](../django_start_project/README.md) because you already covered the material in the earlier chapters. +In this tutorial, the cloud development platform we will be using will be [RunCode](https://runcode.io/). RunCode is a cloud +development environment which people can use without the need to install Python, Django and Visual Studio Code editor locally +on their machines. This cloud environment enables anyone to work from any device that has an internet connection, including +cellphones, tablets, laptop or desktop. + +This removes the need for you to install packages on a borrowed laptop or the need for you to own a laptop to attend the workshop +or follow this tutorial from home as you only need to set up three online accounts. This will also save you time required for +setting up your development environment. You can always do the local installation later on following the guide for your operating +system as a follow-up after finishing the tutorial. However, loading the development environment requires good and fast internet +for this solution to work for you. + +> **Note** There are sections of this tutorial which depend on the platform you are working on. If you follow the +local installation steps for Windows, Linux, OS X or Chromebook, you will need to follow instructions for your operating system. +If you follow RunCode Cloud Environment setup instructions, then you will need to follow instructions for +RunCode development environment. +For this reason, the tutorial has been divided into sections based on these platforms. Feel free to explore instructions +for other platforms if you hve time. + +# Pick your operating system/platform +To install software or setup your development environment and follow the tutorial, please pick your operating system or +platform which you will be following the tutorial on. + +* [RunCode Cloud](../runcode/README.md) +* [ChromeBook](../chromebook/README.md) +* [Linux](../linux/README.md) +* [Mac OSX](../macosx/README.md) +* [Windows](../windows/README.md) + +Enjoy the workshop! diff --git a/en/intro_to_command_line/README.md b/en/intro_to_command_line/README.md index b7c67bb6f03..f75bddcd1f7 100644 --- a/en/intro_to_command_line/README.md +++ b/en/intro_to_command_line/README.md @@ -1,441 +1,6 @@ # Introduction to the command-line interface -> For readers at home: this chapter is covered in the [Your new friend: Command Line](https://www.youtube.com/watch?v=jvZLWhkzX-8) video. - -It's exciting, right?! You'll write your first line of code in just a few minutes! :) - -__Let us introduce you to your first new friend: the command line!__ - -The following steps will show you how to use the black window all hackers use. It might look a bit scary at first but really it's just a prompt waiting for commands from you. - -> **Note** Please note that throughout this book we use the terms 'directory' and 'folder' interchangeably but they are one and the same thing. - -## What is the command line? - -The window, which is usually called the __command line__ or __command-line interface__, is a text-based application for viewing, handling, and manipulating files on your computer. It's much like Windows Explorer or Finder on the Mac, but without the graphical interface. Other names for the command line are: *cmd*, *CLI*, *prompt*, *console* or *terminal*. - -## Open the command-line interface - -To start some experiments we need to open our command-line interface first. - -{% include "/intro_to_command_line/open_instructions.md" %} - -## Prompt - -You now should see a white or black window that is waiting for your commands. - - - - -If you're on Mac or Linux, you probably see a `$`, like this: - -{% filename %}command-line{% endfilename %} -``` -$ -``` - - - - - -On Windows, you probably see a `>`, like this: - -{% filename %}command-line{% endfilename %} -``` -> -``` - -Take a look at the Linux section just above now -- you'll see something more like that when you get to PythonAnywhere later in the tutorial. - - - -Each command will be prepended by a `$` or `>` and one space, but you should not type it. Your computer will do it for you. :) - -> Just a small note: in your case there may be something like `C:\Users\ola>` or `Olas-MacBook-Air:~ ola$` before the prompt sign, and this is 100% OK. - -The part up to and including the `$` or the `>` is called the *command line prompt*, or *prompt* for short. It prompts you to input something there. - -In the tutorial, when we want you to type in a command, we will include the `$` or `>`, and occasionally more to the left. Ignore the left part and only type in the command, which starts after the prompt. - -## Your first command (YAY!) - -Let's start by typing this command: - - - -{% filename %}command-line{% endfilename %} -``` -$ whoami -``` - - - - - - -{% filename %}command-line{% endfilename %} -``` -> whoami -``` - - - -And then hit `enter`. This is our result: - -{% filename %}command-line{% endfilename %} -``` -$ whoami -olasitarska -``` - -As you can see, the computer has just printed your username. Neat, huh? :) - -> Try to type each command; do not copy-paste. You'll remember more this way! - -## Basics - -Each operating system has a slightly different set of commands for the command line, so make sure to follow instructions for your operating system. Let's try this, shall we? - -### Current directory - -It'd be nice to know where are we now, right? Let's see. Type this command and hit `enter`: - - - - -{% filename %}command-line{% endfilename %} -``` -$ pwd -/Users/olasitarska -``` - -> Note: 'pwd' stands for 'print working directory'. - - - - - - -{% filename %}command-line{% endfilename %} -``` -> cd -C:\Users\olasitarska -``` -> Note: 'cd' stands for 'change directory'. With PowerShell you can use pwd just like on Linux or Mac OS X. - - - -You'll probably see something similar on your machine. Once you open the command line you usually start at your user's home directory. - ---- - -### Learn more about a command - -Many commands you can type at the command prompt have built-in help that you can display and read! For example, to learn more about the current directory command: - - - -OS X and Linux have a `man` command, which gives you help on commands. Try `man pwd` and see what it says, or put `man` before other commands to see their help. The output of `man` is normally paged. Use the space bar to move to the next page, and `q` to quit looking at the help. - - - - - - -Adding a `/?` suffix to most commands will print the help page. You may need to scroll your command window up to see it all. Try `cd /?`. - - - - -### List files and directories - -So what's in it? It'd be cool to find out. Let's see: - - - -{% filename %}command-line{% endfilename %} -``` -$ ls -Applications -Desktop -Downloads -Music -... -``` - - - - - -{% filename %}command-line{% endfilename %} -``` -> dir - Directory of C:\Users\olasitarska -05/08/2020 07:28 PM Applications -05/08/2020 07:28 PM Desktop -05/08/2020 07:28 PM Downloads -05/08/2020 07:28 PM Music -... -``` -> Note: In PowerShell you can also use 'ls' like on Linux and Mac OS X. - - ---- - -### Change current directory - -Now, let's go to our Desktop directory: - - - -{% filename %}command-line{% endfilename %} -``` -$ cd Desktop -``` - - - - -{% filename %}command-line{% endfilename %} -``` -$ cd Desktop -``` - -Note that -the directory name "Desktop" might be translated -to the language of your Linux account. -If that's the case, you'll need to replace `Desktop` -with the translated name; -for example, `Schreibtisch` for German. - - - - - - -{% filename %}command-line{% endfilename %} -``` -> cd Desktop -``` - - -Check if it's really changed: - - - -{% filename %}command-line{% endfilename %} -``` -$ pwd -/Users/olasitarska/Desktop -``` - - - - -{% filename %}command-line{% endfilename %} -``` -> cd -C:\Users\olasitarska\Desktop -``` - - -Here it is! - -> PRO tip: if you type `cd D` and then hit `tab` on your keyboard, the command line will automatically fill in the rest of the name so you can navigate faster. If there is more than one folder starting with "D", hit the `tab` key twice to get a list of options. - ---- - -### Create directory - -How about creating a practice directory on your desktop? You can do it this way: - - - -{% filename %}command-line{% endfilename %} -``` -$ mkdir practice -``` - - - - - -{% filename %}command-line{% endfilename %} -``` -> mkdir practice -``` - - -This little command will create a folder with the name `practice` on your desktop. You can check if it's there by looking on your Desktop or by running a `ls` or `dir` command! Try it. :) - -> PRO tip: If you don't want to type the same commands over and over, try pressing the `up arrow` and `down arrow` on your keyboard to cycle through recently used commands. - ---- - -### Exercise! - -A small challenge for you: in your newly created `practice` directory, create a directory called `test`. (Use the `cd` and `mkdir` commands.) - -#### Solution: - - - -{% filename %}command-line{% endfilename %} -``` -$ cd practice -$ mkdir test -$ ls -test -``` - - - - - -{% filename %}command-line{% endfilename %} -``` -> cd practice -> mkdir test -> dir -05/08/2020 07:28 PM test -``` - - -Congrats! :) - ---- - -### Clean up - -We don't want to leave a mess, so let's remove everything we did until that point. - -First, we need to get back to Desktop: - - - -{% filename %}command-line{% endfilename %} -``` -$ cd .. -``` - - - - - -{% filename %}command-line{% endfilename %} -``` -> cd .. -``` - - -Using `..` with the `cd` command will change your current directory to the parent directory (that is, the directory that contains your current directory). - -Check where you are: - - - -{% filename %}command-line{% endfilename %} -``` -$ pwd -/Users/olasitarska/Desktop -``` - - - - - -{% filename %}command-line{% endfilename %} -``` -> cd -C:\Users\olasitarska\Desktop -``` - - -Now time to delete the `practice` directory: - -> __Attention__: Deleting files using `del`, `rmdir` or `rm` is irrecoverable, meaning _the deleted files will be gone forever_! So be very careful with this command. - - - -{% filename %}command-line{% endfilename %} -``` -$ rm -r practice -``` - - - - - -{% filename %}command-line{% endfilename %} -``` -> rmdir /S practice -practice, Are you sure ? Y -``` - - -Done! To be sure it's actually deleted, let's check it: - - - -{% filename %}command-line{% endfilename %} -``` -$ ls -``` - - - - - -{% filename %}command-line{% endfilename %} -``` -> dir -``` - - -### Exit - -That's it for now! You can safely close the command line now. Let's do it the hacker way, alright? :) - - - -{% filename %}command-line{% endfilename %} -``` -$ exit -``` - - - - - -{% filename %}command-line{% endfilename %} -``` -> exit -``` - - -Cool, huh? :) - -## Summary - - Here is a summary of some useful commands: - -Command (Windows) | Command (Mac OS / Linux) | Description | Example ------------------ | ------------------------ | -------------------------- | --------------------------------------------- -exit | exit | close the window | **exit** -cd | cd | change directory | **cd test** -cd | pwd | show the current directory | **cd** (Windows) or **pwd** (Mac OS / Linux) -dir | ls | list directories/files | **dir** -copy | cp | copy file | **copy c:\test\test.txt c:\windows\test.txt** -move | mv | move file | **move c:\test\test.txt c:\windows\test.txt** -mkdir | mkdir | create a new directory | **mkdir testdirectory** -rmdir (or del) | rm | delete a file | **del c:\test\test.txt** -rmdir /S | rm -r | delete a directory | **rm -r testdirectory** -[CMD] /? | man [CMD] | get help for a command | **cd /?** (Windows) or **man cd** (Mac OS / Linux) - -These are just a very few of the commands you can run in your command line, but you're not going to use anything more than that today. - -If you're curious, [ss64.com](http://ss64.com) contains a complete reference of commands for all operating systems. - -## Ready? - -Let's dive into Python! +* [RunCode Cloud](../runcode/intro_to_command_line/README.md) +* [ChromeBook/Linux](../linux/intro_to_command_line/README.md) +* [Mac OSX](../macosx/intro_to_command_line/README.md) +* [Windows](../windows/intro_to_command_line/README.md) \ No newline at end of file diff --git a/en/intro_to_command_line/open_instructions.md b/en/intro_to_command_line/open_instructions.md deleted file mode 100644 index a6fdaa4a67a..00000000000 --- a/en/intro_to_command_line/open_instructions.md +++ /dev/null @@ -1,38 +0,0 @@ - - -Depending on your version of Windows and your keyboard, one of the following should open a command window (you may have to experiment a bit, but you don't have to try all of these suggestions): -- Go to the Start menu or screen, and enter "Command Prompt" in the search field. -- Go to Start menu → Windows System → Command Prompt. -- Go to Start menu → All Programs → Accessories → Command Prompt. -- Go to the Start screen, hover your mouse in the lower-left corner of the screen, and click the down arrow that appears (on a touch screen, instead flick up from the bottom of the screen). The Apps page should open. Click on Command Prompt in the Windows System section. -- Hold the special Windows key on your keyboard and press the "X" key. Choose "Command Prompt" from the pop-up menu. -- Hold the Windows key and press the "R" key to get a "Run" window. Type "cmd" in the box, and click the OK key. - -![Type "cmd" in the "Run" window](../python_installation/images/windows-plus-r.png) - -Later in this tutorial, you will need to have two command windows open at the same time. However, on some versions of Windows, if you already have one command window open and you try to open a second one using the same method, it will instead point you to the command window you already have open. Try it now on your computer and see what happens! If you only get one command window, try one of the other methods in the list above. At least one of them should result in a new command window being opened. - - - - - -Go to Applications → Utilities → Terminal. - - - - - -It's probably under Applications → Accessories → Terminal, or Applications → System → Terminal, but that may depend on your system. If it's not there, you can try to Google it. :) - - - - -> **NOTE** If you followed [RunCode setup instructions](../cloud_development_setup/README.md) follow these steps to open command line. - -To open the Ubuntu terminal on RunCode, go to Workspaces → New Workspace → Blank. This will open a new Visual Studio Code workspace which has an Ubuntu terminal in the bottom pane. - -Altenatively, you can go to Workspaces → New Workspace → Jupyter Lab. This will open a Python prompt which is depicted by `>>>`, you can type `exit()` to get back to the Ubuntu terminal. - -Ubuntu is a version of Linux so from now on you can follow Linux instructions. - - \ No newline at end of file diff --git a/en/linux/README.md b/en/linux/README.md new file mode 100644 index 00000000000..5c1b4df91d0 --- /dev/null +++ b/en/linux/README.md @@ -0,0 +1,56 @@ +# Linux Installation + +> **Note** If you already worked through the installation steps, no need to do this again – you can skip straight ahead +> to [How the Internet works](../how_the_internet_works/README.md). + +# Installation +In this tutorial you will be building a blog. In order to do that, as you go through the tutorial you'll be instructed on how to +install various software on your computer and set up some online accounts as needed. +This page gathers all of the installation and sign-up instructions in one place(which is useful for some workshop formats). + +To install software on your machine, follow the instructions below: + +## Brief intro to the command line {#intro-command-line} +Many of the steps below reference the "console", "terminal", "command window", or "command line" -- these all mean the same thing: +a window on your computer where you can enter commands. When you get to the main tutorial, you'll learn more about the command line. +For now, the main thing you need to know is how to open a command window and what it looks like: + +{% include "intro_to_command_line/open_instructions.md" %} + +## Install Python {#python} +{% include "python_installation/instructions.md" %} + +## Install a code editor {#code-editor} +{% include "/code_editor/instructions.md" %} + +## Set up virtualenv and install Django {#virtualenv} +{% include "django_installation/instructions.md" %} + +## Install Git {#git} +{% include "deploy/install_git.md" %} + +## Create a GitHub account {#github-account} +Go to [GitHub.com](https://www.github.com) and sign up for a new, free user account. Be sure to remember your password +(add it to your password manager, if you use one). + +## Create a PythonAnywhere account {#pythonanywhere-account} +{% include "/deploy/signup_pythonanywhere.md" %} + +# Start reading + +Congratulations, you are all set up and ready to go! If you still have some time before the workshop, it would be useful +to start reading a few of the beginning chapters: + +* [How the internet works](../how_the_internet_works/README.md) + +* [Introduction to the command line](../linux/intro_to_command_line/README.md) + +* [Introduction to Python](../linux/python_introduction/README.md) + +* [What is Django?](../django/README.md) + + +# Enjoy the workshop! + +When you begin the workshop, you'll be able to go straight to[Your first Django project!](../linux/django_start_project/README.md) +because you already covered the material in the earlier chapters. diff --git a/en/linux/deploy/README.md b/en/linux/deploy/README.md new file mode 100644 index 00000000000..defb439aa8c --- /dev/null +++ b/en/linux/deploy/README.md @@ -0,0 +1,191 @@ +# Deploy! + +> **Note** The following chapter can be sometimes a bit hard to get through. Persist and finish it; deployment is an important part of the +website development process. This chapter is placed in the middle of the tutorial so that your mentor can help with the slightly trickier +process of getting your website online. This means you can still finish the tutorial on your own if you run out of time. + +Until now, your website was only available on your computer. Now you will learn how to deploy it! Deploying is the process of publishing +your application on the Internet so people can finally go and see your app. :) + +As you learned, a website has to be located on a server. There are a lot of server providers available on the internet, we're going to use +[PythonAnywhere](https://www.pythonanywhere.com/). PythonAnywhere is free for small applications that don't have too many visitors so it'll +definitely be enough for you now. + +The other external service we'll be using is [GitHub](https://www.github.com), which is a code hosting service. There are others out there, +but almost all programmers have a GitHub account these days, and now so will you! + +These three places will be important to you. Your local computer will be the place where you do development and testing. When you're happy +with the changes, you will place a copy of your program on GitHub. Your website will be on PythonAnywhere and you will update it by +getting a new copy of your code from GitHub. + +# Git + +> **Note** If you already did the [installation steps](../README.md), there's no need to do this again – you can skip to +the next section and start creating your Git repository. + +{% include "install_git.md" %} + +## Starting our Git repository + +Git tracks changes to a particular set of files in what's called a code repository (or "repo" for short). Let's start one for our project. +Open up your console and run these commands, in the `djangogirls` directory: + +> **Note** Check your current working directory with a `pwd` (Linux) command before initializing the repository. +You should be in the `djangogirls` folder. + +{% filename %}command-line{% endfilename %} +``` +$ git init +Initialized empty Git repository in ~/djangogirls/.git/ +$ git config --global user.name "Your Name" +$ git config --global user.email you@example.com +``` +Initializing the git repository is something we need to do only once per project (and you won't have to re-enter the username and email +ever again). + +### Ignoring files + +Git will track changes to all the files and folders in this directory, but there are some files we want it to ignore. We do this by +creating a file called `.gitignore` in the base directory. Open up your editor and create a new file with the following contents: + +{% filename %}.gitignore{% endfilename %} +``` +# Python +*.pyc +*~ +__pycache__ + +# Env +.env +myvenv/ +venv/ + +# Database +db.sqlite3 + +# Static folder at project root +/static/ + +# Visual Studio +.vscode/ +.history/ +*.code-workspace +``` + +And save it as `.gitignore` in the "djangogirls" folder. + +> **Note** The dot at the beginning of the file name is important! If you're having any difficulty creating it (Macs don't like you to +create files that begin with a dot via the Finder, for example), then use the "Save As" feature in your editor; it's bulletproof. And be +sure not to add `.txt`, `.py`, or any other extension to the file name -- it will only be recognized by Git if the name is just +`.gitignore`. +Linux and MacOS treat files with a name that starts with `.` (such as `.gitignore`) as hidden +and the normal `ls` command won't show these files. +Instead use `ls -a` to see the `.gitignore` file. + +> **Note** One of the files you specified in your `.gitignore` file is `db.sqlite3`. That file is your local database, where all of your +users and posts are stored. We'll follow standard web programming practice, meaning that we'll use separate databases for your local +testing site and your live website on PythonAnywhere. The PythonAnywhere database could be SQLite, like your development machine, but +usually you will use one called MySQL which can deal with a lot more site visitors than SQLite. Either way, by ignoring your SQLite +database for the GitHub copy, it means that all of the posts and superuser you created so far are going to only be available locally, and +you'll have to create new ones on production. You should think of your local database as a good playground where you can test different +things and not be afraid that you're going to delete your real posts from your blog. + +It's a good idea to use a `git status` command before `git add` or whenever you find yourself unsure of what has changed. This will help +prevent any surprises from happening, such as wrong files being added or committed. The `git status` command returns information about any +untracked/modified/staged files, the branch status, and much more. The output should be similar to the following: + + +{% filename %}command-line{% endfilename %} +``` +$ git status +On branch main + +No commits yet + +Untracked files: + (use "git add ..." to include in what will be committed) + + .gitignore + blog/ + manage.py + mysite/ + requirements.txt + +nothing added to commit but untracked files present (use "git add" to track) +``` + +And finally we save our changes. Go to your console and run these commands: + +{% filename %}command-line{% endfilename %} +``` +$ git add . +$ git commit -m "My Django Girls app, first commit" + [...] + 13 files changed, 200 insertions(+) + create mode 100644 .gitignore + [...] + create mode 100644 mysite/wsgi.py +``` + + +## Pushing your code to GitHub + +Go to [GitHub.com](https://www.github.com) and sign up for a new, free user account. (If you already did that in the workshop prep, that is +great!) Be sure to remember your password (add it to your password manager, if you use one). + +Then, create a new repository, giving it the name "my-first-blog". Leave the "initialize with a README" checkbox unchecked, leave the +.gitignore option blank (we've done that manually) and leave the License as None. + +![](images/new_github_repo.png) + +> **Note** The name `my-first-blog` is important – you could choose something else, but it's going to occur lots of times in the +instructions below, and you'd have to substitute it each time. It's probably easier to stick with the name `my-first-blog`. + +On the next screen, you'll be shown your repo's clone URL, which you will use in some of the commands that follow: + +![](images/github_get_repo_url_screenshot.png) + +Now we need to hook up the Git repository on your computer to the one up on GitHub. + +Type the following into your console (replace `` with the username you entered when you created your GitHub account, +but without the angle-brackets -- the URL should match the clone URL you just saw). + +{% filename %}command-line{% endfilename %} +``` +$ git remote add origin https://github.com//my-first-blog.git +$ git push -u origin HEAD +``` + +When you push to GitHub, you'll be asked for your GitHub username and password (either right there in the command-line window or in a pop- +up window), and after entering credentials you should see something like this: + +{% filename %}command-line{% endfilename %} +``` +Counting objects: 6, done. +Writing objects: 100% (6/6), 200 bytes | 0 bytes/s, done. +Total 3 (delta 0), reused 0 (delta 0) +To https://github.com/ola/my-first-blog.git + * [new branch] main -> main +Branch main set up to track remote branch main from origin. +``` + + + +Your code is now on GitHub. Go and check it out! You'll find it's in fine company – [Django](https://github.com/django/django), the +[Django Girls Tutorial](https://github.com/DjangoGirls/tutorial), and many other great open source software projects also host their code on GitHub. :) + +{% include "/deploy/pythonanywhere.md" %} + +# Check out your site! + +The default page for your site should say "It worked!", just like it does on your local computer. Try adding `/admin/` to the end of the +URL, and you'll be taken to the admin site. Log in with the username and password, and you'll see you can add new Posts on the server -- +remember, the posts from your local test database were not sent to your live blog. + +Once you have a few posts created, you can go back to your local setup (not PythonAnywhere). From here you should work on your local setup +to make changes. This is a common workflow in web development – make changes locally, push those changes to GitHub, and pull your changes +down to your live Web server. This allows you to work and experiment without breaking your live Web site. Pretty cool, huh? + + +Give yourself a *HUGE* pat on the back! Server deployments are one of the trickiest parts of web development and it often takes people +several days before they get them working. But you've got your site live, on the real Internet! diff --git a/en/linux/deploy/images/github_get_repo_url_screenshot.png b/en/linux/deploy/images/github_get_repo_url_screenshot.png new file mode 100644 index 00000000000..ee1560b1e85 Binary files /dev/null and b/en/linux/deploy/images/github_get_repo_url_screenshot.png differ diff --git a/en/linux/deploy/images/new_github_repo.png b/en/linux/deploy/images/new_github_repo.png new file mode 100644 index 00000000000..d1f82e5d863 Binary files /dev/null and b/en/linux/deploy/images/new_github_repo.png differ diff --git a/en/linux/deploy/install_git.md b/en/linux/deploy/install_git.md new file mode 100644 index 00000000000..87062afee52 --- /dev/null +++ b/en/linux/deploy/install_git.md @@ -0,0 +1,47 @@ +Git is a "version control system" used by a lot of programmers. This software can track changes to files over time so that you can recall +specific versions later. A bit like the "track changes" feature in word processor programs (e.g., Microsoft Word or LibreOffice Writer), but +much more powerful. + +## Installing Git + + + +{% filename %}command-line{% endfilename %} +```bash +$ sudo apt install git +``` + +{% filename %}command-line{% endfilename %} +``` +$ git config --global --add init.defaultBranch main +``` + + + + + +{% filename %}command-line{% endfilename %} +```bash +$ sudo dnf install git +``` + +{% filename %}command-line{% endfilename %} +``` +$ git config --global --add init.defaultBranch main +``` + + + + + +{% filename %}command-line{% endfilename %} +```bash +$ sudo zypper install git +``` + +{% filename %}command-line{% endfilename %} +``` +$ git config --global --add init.defaultBranch main +``` + + diff --git a/en/linux/django_installation/README.md b/en/linux/django_installation/README.md new file mode 100644 index 00000000000..04b47e08e15 --- /dev/null +++ b/en/linux/django_installation/README.md @@ -0,0 +1,6 @@ +# Django installation + +> **Note** If you already worked through the [installation steps](../installation/README.md) then you've already done +> this – you can go straight to the next chapter! + +{% include "instructions.md" %} diff --git a/en/linux/django_installation/instructions.md b/en/linux/django_installation/instructions.md new file mode 100644 index 00000000000..0f73b79c99c --- /dev/null +++ b/en/linux/django_installation/instructions.md @@ -0,0 +1,166 @@ +> Part of this section is based on tutorials by Geek Girls Carrots (https://github.com/ggcarrots/django-carrots). + +> Part of this section is based on the [django-marcador tutorial](http://django-marcador.keimlink.de/) licensed under +> the Creative Commons Attribution-ShareAlike 4.0 International License. +> The django-marcador tutorial is copyrighted by Markus Zapke-Gründemann et al. + + +## Virtual environment + +Before we install Django we will get you to install an extremely useful tool to help keep your coding environment tidy +on your computer. It's possible to skip this step, but it's highly recommended. Starting with the best possible setup will save +you a lot of trouble in the future! + +So, let's create a **virtual environment** (also called a *virtualenv*). Virtualenv will isolate your Python/Django setup on a per-project basis. +This means that any changes you make to one website won't affect any others you're also developing. Neat, right? + +All you need to do is find a directory in which you want to create the `virtualenv`; your home directory, for example. + +For this tutorial we will be using a new directory `djangogirls` from your home directory: + +{% filename %}command-line{% endfilename %} +``` +$ mkdir djangogirls +$ cd djangogirls +``` + +We will make a virtualenv called `myvenv`. The general command will be in the format: + +{% filename %}command-line{% endfilename %} +``` +$ python3 -m venv myvenv +``` + +We can create a `virtualenv` on both Linux and OS X by running `python3 -m venv myvenv`. It will look like this: + +{% filename %}command-line{% endfilename %} +``` +$ python3 -m venv myvenv +``` + +`myvenv` is the name of your `virtualenv`. You can use any other name, but stick to lowercase and use no spaces. It is also +a good idea to keep the name short as you'll be referencing it a lot! + +> __NOTE:__ On some versions of Debian/Ubuntu you may receive the following error: + +>{% filename %}command-line{% endfilename %} +>``` +>The virtual environment was not created successfully because ensurepip is not available. + +> On Debian/Ubuntu systems, you need to install the python3-venv package using the following command. +> apt install python3-venv +>You may need to use sudo with that command. After installing the python3-venv package, recreate your virtual environment. +>``` +> +> In this case, follow the instructions above and install the `python3-venv` package: +>{% filename %}command-line{% endfilename %} +>``` +>$ sudo apt install python3-venv +>``` + +> __NOTE:__ On some versions of Debian/Ubuntu initiating the virtual environment like this currently gives the +> following error: + +>{% filename %}command-line{% endfilename %} +>``` +>Error: Command '['/home/eddie/Slask/tmp/venv/bin/python3', '-Im', 'ensurepip', +>'--upgrade', '--default-pip']' returned non-zero exit status 1 +>``` + +> To get around this, use the `virtualenv` command instead. + +>{% filename %}command-line{% endfilename %} +>``` +>$ sudo apt install python-virtualenv +>$ virtualenv --python=python{{ book.py_version }} myvenv +>``` + +> __NOTE:__ If you get an error like + +>{% filename %}command-line{% endfilename %} +>``` +>E: Unable to locate package python3-venv +>``` + +> then instead run: +> +>{% filename %}command-line{% endfilename %} +>``` +>sudo apt install python{{ book.py_version }}-venv +>``` + +## Working with virtualenv + +The command above will create a directory called `myvenv` (or whatever name you chose) that contains our virtual environment (basically a bunch of directories and files). + +Start your virtual environment by running: + +{% filename %}command-line{% endfilename %} +``` +$ source myvenv/bin/activate +``` + +Remember to replace `myvenv` with your chosen `virtualenv` name! + +> __NOTE:__ If the command `source` is not available, try doing this instead: +> +>{% filename %}command-line{% endfilename %} +>``` +>$ . myvenv/bin/activate +>``` + +You will know that you have `virtualenv` started when you see that the prompt in your console is prefixed with `(myvenv)`. + +When working within a virtual environment, `python` will automatically refer to the correct version so you can use `python` instead of `python3`. + +OK, we have all important dependencies in place. We can finally install Django! + +## Installing Django {#django} + +Now that you have your `virtualenv` started, you can install Django. + +Before we do that, we should make sure we have the latest version of `pip`, the software that we use to install Django: + +{% filename %}command-line{% endfilename %} +``` +(myvenv) ~$ python -m pip install --upgrade pip +``` + +### Installing packages with requirements + +A requirements file keeps a list of dependencies to be installed using `pip install`: + +First create a `requirements.txt` file inside of the `djangogirls/` folder, using the code editor that you installed earlier. You do +this by opening a new file in the code editor and then saving it as `requirements.txt` in the `djangogirls/` folder. Your directory +will look like this: + +``` +djangogirls +├── myvenv +│ └── ... +└───requirements.txt +``` + +In your `djangogirls/requirements.txt` file you should add the following text: + +{% filename %}djangogirls/requirements.txt{% endfilename %} +``` +Django~={{ book.django_version }} +``` + +Now, run `pip install -r requirements.txt` to install Django. + +{% filename %}command-line{% endfilename %} +``` +(myvenv) ~$ pip install -r requirements.txt +Collecting Django~={{ book.django_version }} (from -r requirements.txt (line 1)) + Downloading Django-{{ book.django_version }}-py3-none-any.whl (7.9MB) +Installing collected packages: Django +Successfully installed Django-{{ book.django_version }} +``` + + +If you get an error when calling pip on Ubuntu 12.04 please run `python -m pip install -U --force-reinstall pip` to fix the pip installation in the virtualenv. + +That's it! +You're now (finally) ready to create a Django application! diff --git a/en/linux/django_start_project/README.md b/en/linux/django_start_project/README.md new file mode 100644 index 00000000000..c97fb3e10d8 --- /dev/null +++ b/en/linux/django_start_project/README.md @@ -0,0 +1,193 @@ +# Your first Django project! + +> Part of this chapter is based on tutorials by Geek Girls Carrots (https://github.com/ggcarrots/django-carrots). + +> Parts of this chapter are based on the [django-marcador +tutorial](http://django-marcador.keimlink.de/) licensed under the Creative Commons +Attribution-ShareAlike 4.0 International License. The django-marcador tutorial +is copyrighted by Markus Zapke-Gründemann et al. + +We're going to create a small blog! + +The first step is to start a new Django project. Basically, this means that we'll run some scripts provided by Django that will create the skeleton +of a Django project for us. This is just a bunch of directories and files that we will use later. + +The names of some files and directories are very important for Django. You should not rename the files that we are about to create. Moving them to a +different place is also not a good idea. Django needs to maintain a certain structure to be able to find important things. + +> Remember to run everything in the virtualenv. If you don't see a prefix `(myvenv)` in your console, you need to activate your virtualenv. We +explained how to do that in the __Django installation__ chapter in the __Working with virtualenv__ part. Typing +`source myvenv/bin/activate` on Mac OS X or Linux will do this for you. + +In your Linux console, you should run the following command. **Don't forget to add the period (or dot) `.` at the end!** + +{% filename %}command-line{% endfilename %} +``` +(myvenv) ~/djangogirls$ django-admin startproject mysite . +``` + +> The period `.` is crucial because it tells the script to install Django in your current directory (for which the +> period `.` is a short-hand reference). + +> **Note** When typing the command above, remember that you only type the part which starts by `django-admin`. +> The `(myvenv) ~/djangogirls$` part shown here is just example of the prompt that will be inviting your input on your +> command line. + +`django-admin.py` is a script that will create the directories and files for you. +You should now have a directory structure which looks like this: + +``` +djangogirls +├── manage.py +├── mysite +│   ├── asgi.py +│   ├── __init__.py +│   ├── settings.py +│   ├── urls.py +│   └── wsgi.py +├── myvenv +│   └── ... +└── requirements.txt +``` +> **Note**: in your directory structure, you will also see your `myvenv` directory that we created before. + +`manage.py` is a script that helps with management of the site. With it we will be able (amongst other things) to start a web server on our computer without installing anything else. + +The `settings.py` file contains the configuration of your website. + +Remember when we talked about a mail carrier checking where to deliver a letter? `urls.py` file contains a list of patterns used by `urlresolver`. + +Let's ignore the other files for now as we won't change them. The only thing to remember is not to delete them by accident! + + +## Changing settings + +Let's make some changes in `mysite/settings.py`. Open the file using the code editor you installed earlier. + +**Note**: Keep in mind that `settings.py` is a regular file, like any other. You can open it from inside the code editor, using the +"file -> open" menu actions. This should get you the usual window in which you can navigate to your `settings.py` file and select it. +Alternatively, you can open the file by navigating to the djangogirls folder on your desktop and right-clicking on it. +Then, select your code editor from the list. Selecting the editor is important as you might have other programs installed that can +open the file but will not let you edit it. + +It would be nice to have the correct time on our website. Go to [Wikipedia's list of time zones](https://en.wikipedia.org/wiki/List_of_tz_database_time_zones) +and copy your relevant time zone (TZ) (e.g. `Europe/Berlin`). + +In `settings.py`, find the line that contains `TIME_ZONE` and modify it to choose your own timezone. For example: + +{% filename %}mysite/settings.py{% endfilename %} +```python +TIME_ZONE = 'Europe/Berlin' +``` + +A language code consist of the language, e.g. `en` for English or `de` for German, and the country code, e.g. `de` for +Germany or `ch` for Switzerland. If English is not your native language, you can add this to change the default buttons and notifications +from Django to be in your language. So you would have "Cancel" button translated into the language you defined here. +[Django comes with a lot of prepared translations](https://docs.djangoproject.com/en/3.2/ref/settings/#language-code). + +If you want a different language, change the language code by changing the following line: + +{% filename %}mysite/settings.py{% endfilename %} +```python +LANGUAGE_CODE = 'de-ch' +``` + + +We'll also need to add a path for static files.(We'll find out all about static files and CSS later in the tutorial.) +Go down to the *end* of the file, and just underneath the `STATIC_URL` entry, add a new one called `STATIC_ROOT`: + +{% filename %}mysite/settings.py{% endfilename %} +```python +STATIC_URL = '/static/' +STATIC_ROOT = BASE_DIR / 'static' +``` + +When `DEBUG` is `True` and `ALLOWED_HOSTS` is empty, the host is validated against `['localhost', '127.0.0.1', '[::1]']`. +This won't match our hostname on PythonAnywhere once we deploy our application so we will change the following setting: + +{% filename %}mysite/settings.py{% endfilename %} +```python +ALLOWED_HOSTS = ['127.0.0.1', '.pythonanywhere.com'] +``` + +## Set up a database + +There's a lot of different database software that can store data for your site. We'll use the default one, `sqlite3`. + +This is already set up in this part of your `mysite/settings.py` file: + +{% filename %}mysite/settings.py{% endfilename %} +```python +DATABASES = { + 'default': { + 'ENGINE': 'django.db.backends.sqlite3', + 'NAME': BASE_DIR / 'db.sqlite3', + } +} +``` + +To create a database for our blog, let's run the following in the console: `python manage.py migrate` (we need to be in +the `djangogirls` directory that contains the `manage.py` file). If that goes well, you should see something like this: + +{% filename %}command-line{% endfilename %} +``` +(myvenv) ~/djangogirls$ python manage.py migrate +Operations to perform: + Apply all migrations: admin, auth, contenttypes, sessions +Running migrations: + Applying contenttypes.0001_initial... OK + Applying auth.0001_initial... OK + Applying admin.0001_initial... OK + Applying admin.0002_logentry_remove_auto_add... OK + Applying admin.0003_logentry_add_action_flag_choices... OK + Applying contenttypes.0002_remove_content_type_name... OK + Applying auth.0002_alter_permission_name_max_length... OK + Applying auth.0003_alter_user_email_max_length... OK + Applying auth.0004_alter_user_username_opts... OK + Applying auth.0005_alter_user_last_login_null... OK + Applying auth.0006_require_contenttypes_0002... OK + Applying auth.0007_alter_validators_add_error_messages... OK + Applying auth.0008_alter_user_username_max_length... OK + Applying auth.0009_alter_user_last_name_max_length... OK + Applying auth.0010_alter_group_name_max_length... OK + Applying auth.0011_update_proxy_permissions... OK + Applying auth.0012_alter_user_first_name_max_length... OK + Applying sessions.0001_initial... OK +``` + +And we're done! Time to start the web server and see if our website is working! + +## Starting the web server + +You need to be in the directory that contains the `manage.py` file (the `djangogirls` directory). In the console, we can start the +web server by running `python manage.py runserver`: + +{% filename %}command-line{% endfilename %} +``` +(myvenv) ~/djangogirls$ python manage.py runserver +``` + +Now you need to check that your website is running. Open your browser (Firefox, Chrome, Safari, Internet Explorer or whatever you use) +and enter this address: + +{% filename %}browser{% endfilename %} +``` +http://127.0.0.1:8000/ +``` + +Congratulations! You've just created your first website and run it using a web server! Isn't that awesome? + +![Install worked!](images/install_worked.png) + +Note that a command window can only run one thing at a time, and the command window you opened earlier is running the +web server. +As long as the web server is running and waiting for additional incoming requests, the terminal will accept new text but +will not execute new commands. + +> We reviewed how web servers work in the How the Internet works chapter. + +To type additional commands while the web server is running, open a new terminal window and activate your virtualenv -- to review +instructions on how to open a second terminal window, see [Introduction to the command line](../intro_to_command_line/README.md). +To stop the web server, switch back to the window in which it's running and press CTRL+C - Control and C keys together (on Windows, you might have to press Ctrl+Break). + +Ready for the next step? It's time to create some content! diff --git a/en/linux/django_start_project/images/install_worked.png b/en/linux/django_start_project/images/install_worked.png new file mode 100644 index 00000000000..4354c634ddb Binary files /dev/null and b/en/linux/django_start_project/images/install_worked.png differ diff --git a/en/linux/intro_to_command_line/README.md b/en/linux/intro_to_command_line/README.md new file mode 100644 index 00000000000..6d7584ab18d --- /dev/null +++ b/en/linux/intro_to_command_line/README.md @@ -0,0 +1,252 @@ +# Introduction to the command-line interface + +> For readers at home: this chapter is covered in the +[Your new friend: Command Line](https://www.youtube.com/watch?v=jvZLWhkzX-8) video. + +It's exciting, right?! You'll write your first line of code in just a few minutes! :) + +__Let us introduce you to your first new friend: the command line!__ + +The following steps will show you how to use the black window all hackers use. It might look a bit scary at first but really it's just a prompt waiting for commands from you. + +> **Note** Please note that throughout this book we use the terms 'directory' and 'folder' interchangeably but they are +> one and the same thing. + +## What is the command line? + +The window, which is usually called the __command line__ or__command-line interface__, is a text-based application for viewing, handling, +and manipulating files on your computer. It's much like Windows Explorer or Finder on the Mac, but without the graphical interface. +Other names for the command line are: *cmd*, *CLI*, *prompt*, *console* or *terminal*. + +## Open the command-line interface + +To start some experiments we need to open our command-line interface first. + +It's probably under Applications → Accessories → Terminal, or Applications → System → Terminal, but that may depend on your system. +If it's not there, you can try to Google it. :) + +## Prompt + +You now should see a white or black window that is waiting for your commands. + +On Linux, you will probably see a `$`, like this: + +{% filename %}command-line{% endfilename %} +``` +$ +``` + +Each command will be prepended by a `$` and one space, but you should not type it. +Your computer will do it for you. :) + +> Just a small note: in your case there may be something like `Olas-MacBook-Air:~ ola$` before the prompt sign, and this +> is 100% OK. + +The part up to and including the `$` is called the *command line prompt*, or *prompt* for short. It prompts you to input something there. + +In the tutorial, when we want you to type in a command, we will include the `$`, and occasionally more to the left. Ignore the left +part and only type in the command, which starts after the prompt. + +## Your first command (YAY!) + +Let's start by typing this command: + +{% filename %}command-line{% endfilename %} +``` +$ whoami +``` + +And then hit `enter`. This is our result: + +{% filename %}command-line{% endfilename %} +``` +$ whoami +olasitarska +``` + +As you can see, the computer has just printed your username. Neat, huh? :) + +> Try to type each command; do not copy-paste. You'll remember more this way! + +## Basics + +Each operating system has a slightly different set of commands for the command line, so make sure to follow instructions +for your operating system. Let's try this, shall we? + +### Current directory + +It'd be nice to know where are we now, right? Let's see. Type this command and hit `enter`: + +{% filename %}command-line{% endfilename %} +``` +$ pwd +/Users/olasitarska +``` + +> Note: 'pwd' stands for 'print working directory'. + +You'll probably see something similar on your machine. Once you open the command line you usually start at your user's home directory. + +--- + +### Learn more about a command + +Many commands you can type at the command prompt have built-in help that you can display and read! For example, to learn more about the current directory command: + +Linux has a `man` command, which gives you help on commands. Try `man pwd` and see what it says, or put `man` before other commands to see their help. +The output of `man` is normally paged. Use the space bar to move to the next page, and `q` to quit looking at the help. + +### List files and directories + +So what's in it? It'd be cool to find out. +Let's see: + +{% filename %}command-line{% endfilename %} +``` +$ ls +Applications +Desktop +Downloads +Music +... +``` + +--- + +### Change current directory + +Now, let's go to our Desktop directory: + +{% filename %}command-line{% endfilename %} +``` +$ cd Desktop +``` + +Note that the directory name "Desktop" might be translated to the language of your Linux account. If that's the case, you'll need +to replace `Desktop`with the translated name; for example, `Schreibtisch` for German. + +Check if it's really changed: + +{% filename %}command-line{% endfilename %} +``` +$ pwd +/Users/olasitarska/Desktop +``` + +Here it is! + +> PRO tip: if you type `cd D` and then hit `tab` on your keyboard, the command line will automatically fill in the rest of the name +so you can navigate faster. If there is more than one folder starting with "D", hit the `tab` key twice to get a list of options. + +--- + +### Create directory + +How about creating a practice directory on your desktop? You can do it this way: + +{% filename %}command-line{% endfilename %} +``` +$ mkdir practice +``` + +This little command will create a folder with the name `practice` on your desktop. You can check if it's there by looking on +your Desktop or by running a `ls` or `dir` command! Try it. :) + +> PRO tip: If you don't want to type the same commands over and over, try pressing the `up arrow` and `down arrow` on +your keyboard to cycle through recently used commands. + +--- + +### Exercise! + +A small challenge for you: in your newly created `practice` directory, create a directory called `test`. (Use the `cd` and `mkdir` commands.) + +#### Solution: + +{% filename %}command-line{% endfilename %} +``` +$ cd practice +$ mkdir test +$ ls +test +``` + +Congrats! :) + +--- + +### Clean up + +We don't want to leave a mess, so let's remove everything we did until that point. + +First, we need to get back to Desktop: + +{% filename %}command-line{% endfilename %} +``` +$ cd .. +``` + +Using `..` with the `cd` command will change your current directory to the parent directory (that is, the directory that +contains your current directory). + +Check where you are: + +{% filename %}command-line{% endfilename %} +``` +$ pwd +/Users/olasitarska/Desktop +``` + +Now time to delete the `practice` directory: + +> __Attention__: Deleting files using `del`, `rmdir` or `rm` is irrecoverable, meaning _the deleted files will be gone +forever_! So be very careful with this command. + +{% filename %}command-line{% endfilename %} +``` +$ rm -r practice +``` + +Done! To be sure it's actually deleted, let's check it: + +{% filename %}command-line{% endfilename %} +``` +$ ls +``` + +### Exit + +That's it for now! You can safely close the command line now. Let's do it the hacker way, alright? :) + +{% filename %}command-line{% endfilename %} +``` +$ exit +``` + +Cool, huh? :) + +## Summary + + Here is a summary of some useful commands: + +Command (Windows) | Command (Mac OS / Linux) | Description | Example +----------------- | ------------------------ | -------------------------- | --------------------------------------------- +exit | exit | close the window | **exit** +cd | cd | change directory | **cd test** +cd | pwd | show the current directory | **cd** (Windows) or **pwd** (Mac OS / Linux) +dir | ls | list directories/files | **dir** +copy | cp | copy file | **copy c:\test\test.txt c:\windows\test.txt** +move | mv | move file | **move c:\test\test.txt c:\windows\test.txt** +mkdir | mkdir | create a new directory | **mkdir testdirectory** +rmdir (or del) | rm | delete a file | **del c:\test\test.txt** +rmdir /S | rm -r | delete a directory | **rm -r testdirectory** +[CMD] /? | man [CMD] | get help for a command | **cd /?** (Windows) or **man cd** (Mac OS / Linux) + +These are just a very few of the commands you can run in your command line, but you're not going to use anything more +than that today. + +If you're curious, [ss64.com](http://ss64.com) contains a complete reference of commands for all operating systems. + +## Ready? + +Let's dive into Python! diff --git a/en/linux/intro_to_command_line/open_instructions.md b/en/linux/intro_to_command_line/open_instructions.md new file mode 100644 index 00000000000..70a57cbaaa2 --- /dev/null +++ b/en/linux/intro_to_command_line/open_instructions.md @@ -0,0 +1,7 @@ +## Open the command-line interface + +To start some experiments we need to open our command-line interface first. + +It's probably under Applications → Accessories → Terminal, or Applications → System → Terminal, but that may depend on +your system. +If it's not there, you can try to Google it. :) \ No newline at end of file diff --git a/en/linux/python_installation/README.md b/en/linux/python_installation/README.md new file mode 100644 index 00000000000..c368f40b66e --- /dev/null +++ b/en/linux/python_installation/README.md @@ -0,0 +1,7 @@ +# Python installation + +> **Note** If you already worked through the [installation steps](../README.md), there's no need to do this again – you +> can skip straight ahead to the next chapter! + +{% include "instructions.md" %} + diff --git a/en/python_installation/images/python-installation-options.png b/en/linux/python_installation/images/python-installation-options.png similarity index 100% rename from en/python_installation/images/python-installation-options.png rename to en/linux/python_installation/images/python-installation-options.png diff --git a/en/python_installation/images/windows-plus-r.png b/en/linux/python_installation/images/windows-plus-r.png similarity index 100% rename from en/python_installation/images/windows-plus-r.png rename to en/linux/python_installation/images/windows-plus-r.png diff --git a/en/linux/python_installation/instructions.md b/en/linux/python_installation/instructions.md new file mode 100644 index 00000000000..64895cf3015 --- /dev/null +++ b/en/linux/python_installation/instructions.md @@ -0,0 +1,81 @@ +> For readers at home: this chapter is covered in the +[Installing Python & Code Editor](https://www.youtube.com/watch?v=pVTaqzKZCdA) video. + +> This section is based on a tutorial by Geek Girls Carrots (https://github.com/ggcarrots/django-carrots) + +Django is written in Python. We need Python to do anything in Django. Let's start by installing it! We want you to install the latest version +of Python 3, so if you have any earlier version, you will need to upgrade it. If you already have version {{ book.py_min_version }} or higher you should be fine. + +Please install normal Python as follows, even when you have Anaconda installed on your computer. + + + +It is very likely that you already have Python installed out of the box. To check if you have it installed (and which version it is), +open a console and type the following command: + +{% filename %}command-line{% endfilename %} +``` +$ python3 --version +Python {{ book.py_release }} +``` + +If you have a different version of Python installed, at least {{ book.py_min_version }} (e.g. {{ book.py_min_release }}), then you don't have to upgrade. +If you don't have Python installed, or if you want a different version, first check what Linux distribution you are using with the following command: + +{% filename %}command-line{% endfilename %} +``` +$ grep '^NAME=' /etc/os-release +``` + +Afterwards, depending on the result, follow one of the following installation guides below this section. + + + + + +Type this command into your console: + +{% filename %}command-line{% endfilename %} +``` +$ sudo apt install python3 +``` + + + + + +Use this command in your console: + +{% filename %}command-line{% endfilename %} +``` +$ sudo dnf install python3 +``` + +If you're on older Fedora versions you might get an error that the command `dnf` is not found. In that case, you need to use `yum` instead. + + + + + +Use this command in your console: + +{% filename %}command-line{% endfilename %} +``` +$ sudo zypper install python3 +``` + + + +Verify the installation was successful by opening a command prompt and running the `python3` command: + +{% filename %}command-line{% endfilename %} +``` +$ python3 --version +Python {{ book.py_release }} +``` +The version shown may be different from {{ book.py_release }} -- it should match the version you installed. + +---- + +If you have any doubts, or if something went wrong and you have no idea what to do next, please ask your coach! Sometimes things don't go +smoothly and it's better to ask for help from someone with more experience. diff --git a/en/linux/python_introduction/README.md b/en/linux/python_introduction/README.md new file mode 100644 index 00000000000..7f0208072d2 --- /dev/null +++ b/en/linux/python_introduction/README.md @@ -0,0 +1,15 @@ +{% set warning_icon = '' %} + +# Introduction to Python + +> Part of this chapter is based on tutorials by Geek Girls Carrots (https://github.com/ggcarrots/django-carrots). + +Let's write some code! + +{% include "prompt.md" %} + +{% include "/python_introduction/instructions.md" %} + +{% include "instructions.md" %} + +{% include "/python_introduction/instructions_part_two.md" %} \ No newline at end of file diff --git a/en/python_introduction/images/cupcake.png b/en/linux/python_introduction/images/cupcake.png similarity index 100% rename from en/python_introduction/images/cupcake.png rename to en/linux/python_introduction/images/cupcake.png diff --git a/en/linux/python_introduction/instructions.md b/en/linux/python_introduction/instructions.md new file mode 100644 index 00000000000..3b154d0c2ff --- /dev/null +++ b/en/linux/python_introduction/instructions.md @@ -0,0 +1,18 @@ +On Linux, it will be like this: + +{% filename %}command-line{% endfilename %} +``` +$ cd ~/Desktop +``` + +(Remember that the word "Desktop" might be translated to your local language.) + +If you get stuck, ask for help. That's exactly what the coaches are here for! + +Now use Python to execute the code in the file like this: + +{% filename %}command-line{% endfilename %} +``` +$ python3 python_intro.py +Hello, Django girls! +``` \ No newline at end of file diff --git a/en/linux/python_introduction/prompt.md b/en/linux/python_introduction/prompt.md new file mode 100644 index 00000000000..10d8e110aba --- /dev/null +++ b/en/linux/python_introduction/prompt.md @@ -0,0 +1,19 @@ +## Python prompt + +> For readers at home: this part is covered in the +[Python Basics: Integers, Strings, Lists, Variables and Errors](https://www.youtube.com/watch?v=MO63L4s-20U) video. + +To start playing with Python, we need to open up a *command line* on your computer. You should already know how to do that – you learned it in the +[Intro to Command Line](../intro_to_command_line/README.md) chapter. + +Once you're ready, follow the instructions below. + +We want to open up a Python console, so type in `python3` on Linux and hit `enter`. + +{% filename %}command-line{% endfilename %} +``` +$ python3 +Python {{ book.py_release }} (...) +Type "help", "copyright", "credits" or "license" for more information. +>>> +``` \ No newline at end of file diff --git a/en/macosx/README.md b/en/macosx/README.md new file mode 100644 index 00000000000..63caf608765 --- /dev/null +++ b/en/macosx/README.md @@ -0,0 +1,56 @@ +# OS X Installation + +> **Note** If you already worked through the installation steps, no need to do this again – you can skip straight ahead to +[How the Internet works](../how_the_internet_works/README.md). + +# Installation +In this tutorial you will be building a blog. In order to do that, as you go through the tutorial you'll be instructed on how +to install various software on your computer and set up some online accounts as needed. This page gathers all of the installation +and sign-up instructions in one place (which is useful for some workshop formats). + +To install software on your machine, follow the instructions below: + +## Brief intro to the command line {#intro-command-line} +Many of the steps below reference the "console", "terminal", "command window", or "command line" -- these all mean the same thing: +a window on your computer where you can enter commands. When you get to the main tutorial, you'll learn more about the command line. +For now, the main thing you need to know is how to open a command window and what it looks like: + +{% include "intro_to_command_line/open_instructions.md" %} + +## Install Python {#python} +{% include "python_installation/instructions.md" %} + +## Install a code editor {#code-editor} +{% include "/code_editor/instructions.md" %} + +## Set up virtualenv and install Django {#virtualenv} +{% include "django_installation/instructions.md" %} + +## Install Git {#git} +{% include "deploy/install_git.md" %} + +## Create a GitHub account {#github-account} +Go to [GitHub.com](https://www.github.com) and sign up for a new, free user account. Be sure to remember your password (add it +to your password manager, if you use one). + +## Create a PythonAnywhere account {#pythonanywhere} +{% include "/deploy/signup_pythonanywhere.md" %} + +# Start reading + +Congratulations, you are all set up and ready to go! If you still have some time before the workshop, it would be useful to start +reading a few of the beginning chapters: + +* [How the internet works](../how_the_internet_works/README.md) + +* [Introduction to the command line](../macosx/intro_to_command_line/README.md) + +* [Introduction to Python](../macosx/python_introduction/README.md) + +* [What is Django?](../django/README.md) + + +# Enjoy the workshop! + +When you begin the workshop, you'll be able to go straight to[Your first Django project!](../macosx/django_start_project/README.md) +because you already covered the material in the earlier chapters. \ No newline at end of file diff --git a/en/macosx/deploy/README.md b/en/macosx/deploy/README.md new file mode 100644 index 00000000000..fd02349f9ad --- /dev/null +++ b/en/macosx/deploy/README.md @@ -0,0 +1,200 @@ +# Deploy! + +> **Note** The following chapter can be sometimes a bit hard to get through. Persist and finish it; deployment is an important +part of the website development process. This chapter is placed in the middle of the tutorial so that your mentor can help with +the slightly trickier process of getting your website online. This means you can still finish the tutorial on your own if you run +out of time. + +Until now, your website was only available on your computer. Now you will learn how to deploy it! Deploying is the process of +publishing your application on the Internet so people can finally go and see your app. :) + +As you learned, a website has to be located on a server. There are a lot of server providers available on the internet, we're +going to use[PythonAnywhere](https://www.pythonanywhere.com/). PythonAnywhere is free for small applications that don't have +too many visitors so it'll definitely be enough for you now. + +The other external service we'll be using is [GitHub](https://www.github.com), which is a code hosting service. There are +others out there, but almost all programmers have a GitHub account these days, and now so will you! + +These three places will be important to you. Your local computer will be the place where you do development and testing. +When you're happy with the changes, you will place a copy of your program on GitHub. Your website will be on PythonAnywhere +and you will update it by getting a new copy of your code from GitHub. + +# Git + +> **Note** If you already did the [installation steps](../README.md), there's no need to do this again – you can skip to +the next section and start creating your Git repository. + +{% include "install_git.md" %} + +## Starting our Git repository + +Git tracks changes to a particular set of files in what's called a code repository (or "repo" for short). Let's start one for +our project. Open up your console and run these commands, in the `djangogirls` directory: + +> **Note** Check your current working directory with a `pwd` (Linux) command before initializing the repository. You should be +in the `djangogirls` folder. + +{% filename %}command-line{% endfilename %} +``` +$ git init +Initialized empty Git repository in ~/djangogirls/.git/ +$ git config --global user.name "Your Name" +$ git config --global user.email you@example.com +``` +Initializing the git repository is something we need to do only once per project (and you won't have to re-enter the username +and email ever again). + +### Ignoring files + +Git will track changes to all the files and folders in this directory, but there are some files we want it to ignore. We do +this by creating a file called `.gitignore` in the base directory. Open up your editor and create a new file with the +following contents: + +{% filename %}.gitignore{% endfilename %} +``` +# Python +*.pyc +*~ +__pycache__ + +# Env +.env +myvenv/ +venv/ + +# Database +db.sqlite3 + +# Static folder at project root +/static/ + +# macOS +._* +.DS_Store +.fseventsd +.Spotlight-V100 + +# Visual Studio +.vscode/ +.history/ +*.code-workspace +``` + +And save it as `.gitignore` in the "djangogirls" folder. + +> **Note** The dot at the beginning of the file name is important! If you're having any difficulty creating it (Macs don't +like you to create files that begin with a dot via the Finder, for example), then use the "Save As" feature in your editor; +it's bulletproof. And be sure not to add `.txt`, `.py`, or any other extension to the file name -- it will only be recognized +by Git if the name is just`.gitignore`. Linux and MacOS treat files with a name that starts with `.` (such as `.gitignore`) +as hidden and the normal `ls` command won't show these files. Instead use `ls -a` to see the `.gitignore` file. + +> **Note** One of the files you specified in your `.gitignore` file is `db.sqlite3`. That file is your local database, where +all of your users and posts are stored. We'll follow standard web programming practice, meaning that we'll use separate databases +for your local testing site and your live website on PythonAnywhere. The PythonAnywhere database could be SQLite, like your +development machine, but usually you will use one called MySQL which can deal with a lot more site visitors than SQLite. +Either way, by ignoring your SQLite database for the GitHub copy, it means that all of the posts and superuser you created so +far are going to only be available locally, and you'll have to create new ones on production. You should think of your local +database as a good playground where you can test different things and not be afraid that you're going to delete your real +posts from your blog. + +It's a good idea to use a `git status` command before `git add` or whenever you find yourself unsure of what has changed. +This will help prevent any surprises from happening, such as wrong files being added or committed. The `git status` command +returns information about any untracked/modified/staged files, the branch status, and much more. The output should be similar +to the following: +{% filename %}command-line{% endfilename %} +``` +$ git status +On branch main + +No commits yet + +Untracked files: + (use "git add ..." to include in what will be committed) + + .gitignore + blog/ + manage.py + mysite/ + requirements.txt + +nothing added to commit but untracked files present (use "git add" to track) +``` + +And finally we save our changes. Go to your console and run these commands: + +{% filename %}command-line{% endfilename %} +``` +$ git add . +$ git commit -m "My Django Girls app, first commit" + [...] + 13 files changed, 200 insertions(+) + create mode 100644 .gitignore + [...] + create mode 100644 mysite/wsgi.py +``` + + +## Pushing your code to GitHub + +Go to [GitHub.com](https://www.github.com) and sign up for a new, free user account. (If you already did that in the workshop +prep, that is great!) Be sure to remember your password (add it to your password manager, if you use one). + +Then, create a new repository, giving it the name "my-first-blog". Leave the "initialize with a README" checkbox unchecked, +leave the .gitignore option blank (we've done that manually) and leave the License as None. + + +![](images/new_github_repo.png) + +> **Note** The name `my-first-blog` is important – you could choose something else, but it's going to occur lots of times in the +instructions below, and you'd have to substitute it each time. It's probably easier to stick with the name `my-first-blog`. + +On the next screen, you'll be shown your repo's clone URL, which you will use in some of the commands that follow: + +![](images/github_get_repo_url_screenshot.png) + +Now we need to hook up the Git repository on your computer to the one up on GitHub. + +Type the following into your console (replace `` with the username you entered when you created your +GitHub account, but without the angle-brackets -- the URL should match the clone URL you just saw). + +{% filename %}command-line{% endfilename %} +``` +$ git remote add origin https://github.com//my-first-blog.git +$ git push -u origin main +``` + +When you push to GitHub, you'll be asked for your GitHub username and password (either right there in the command-line window or +in a pop-up window), and after entering credentials you should see something like this: + +{% filename %}command-line{% endfilename %} +``` +Counting objects: 6, done. +Writing objects: 100% (6/6), 200 bytes | 0 bytes/s, done. +Total 3 (delta 0), reused 0 (delta 0) +To https://github.com/ola/my-first-blog.git + * [new branch] main -> main +Branch main set up to track remote branch main from origin. +``` + + + +Your code is now on GitHub. Go and check it out! You'll find it's in fine company – [Django](https://github.com/django/django), the +[Django Girls Tutorial](https://github.com/DjangoGirls/tutorial), and many other great open source software projects also host +their code on GitHub. :) + +{% include "/deploy/pythonanywhere.md" %} + +# Check out your site! + +The default page for your site should say "It worked!", just like it does on your local computer. Try adding `/admin/` to the +end of the URL, and you'll be taken to the admin site. Log in with the username and password, and you'll see you can add new +Posts on the server -- remember, the posts from your local test database were not sent to your live blog. + +Once you have a few posts created, you can go back to your local setup (not PythonAnywhere). From here you should work on your +local setup to make changes. This is a common workflow in web development – make changes locally, push those changes to GitHub, +and pull your changes down to your live Web server. This allows you to work and experiment without breaking your live Web site. +Pretty cool, huh? + + +Give yourself a *HUGE* pat on the back! Server deployments are one of the trickiest parts of web development and it often takes +people several days before they get them working. But you've got your site live, on the real Internet! diff --git a/en/macosx/deploy/images/github_get_repo_url_screenshot.png b/en/macosx/deploy/images/github_get_repo_url_screenshot.png new file mode 100644 index 00000000000..ee1560b1e85 Binary files /dev/null and b/en/macosx/deploy/images/github_get_repo_url_screenshot.png differ diff --git a/en/macosx/deploy/images/new_github_repo.png b/en/macosx/deploy/images/new_github_repo.png new file mode 100644 index 00000000000..d1f82e5d863 Binary files /dev/null and b/en/macosx/deploy/images/new_github_repo.png differ diff --git a/en/macosx/deploy/install_git.md b/en/macosx/deploy/install_git.md new file mode 100644 index 00000000000..0a8e85fe718 --- /dev/null +++ b/en/macosx/deploy/install_git.md @@ -0,0 +1,16 @@ +Git is a "version control system" used by a lot of programmers. This software can track changes to files over time so that +you can recall specific versions later. A bit like the "track changes" feature in word processor programs (e.g., Microsoft +Word or LibreOffice Writer), but much more powerful. + +## Installing Git + +Download Git from [git-scm.com](https://git-scm.com/) and follow the instructions. + +During installation, if you are presented with the option of "Adjusting the name of the initial branch in new repositories", +please choose to "Override the default"and use "main". This will align your installation of Git with the broad direction of the +global developer community, and the "main" branch will be used through the remainder of this tutorial. Please see +https://sfconservancy.org/news/2020/jun/23/gitbranchname/ and https://github.com/github/renaming for further discussion of this +subject. + +> **Note** If you are running OS X 10.6, 10.7, or 10.8, you will need to install the version of git from here: +[Git installer for OS X Snow Leopard](https://sourceforge.net/projects/git-osx-installer/files/git-2.3.5-intel-universal-snow-leopard.dmg/download) diff --git a/en/macosx/django_installation/README.md b/en/macosx/django_installation/README.md new file mode 100644 index 00000000000..a359be06e17 --- /dev/null +++ b/en/macosx/django_installation/README.md @@ -0,0 +1,6 @@ +# Django installation + +> **Note** If you already worked through the [installation steps](../installation/README.md) then you've already done this – +you can go straight to the next chapter! + +{% include "instructions.md" %} diff --git a/en/macosx/django_installation/instructions.md b/en/macosx/django_installation/instructions.md new file mode 100644 index 00000000000..5b208141608 --- /dev/null +++ b/en/macosx/django_installation/instructions.md @@ -0,0 +1,118 @@ +> Part of this section is based on tutorials by Geek Girls Carrots (https://github.com/ggcarrots/django-carrots). + +> Part of this section is based on the [django-marcador tutorial](http://django-marcador.keimlink.de/) licensed under the +Creative Commons Attribution-ShareAlike 4.0 International License. The django-marcador tutorial is copyrighted by +Markus Zapke-Gründemann et al. + + +## Virtual environment + +Before we install Django we will get you to install an extremely useful tool to help keep your coding environment tidy on +your computer. It's possible to skip this step, but it's highly recommended. Starting with the best possible setup will +save you a lot of trouble in the future! + +So, let's create a **virtual environment** (also called a *virtualenv*). Virtualenv will isolate your Python/Django setup +on a per-project basis. This means that any changes you make to one website won't affect any others you're also developing. +Neat, right? + +All you need to do is find a directory in which you want to create the`virtualenv`; your home directory, for example. + +For this tutorial we will be using a new directory `djangogirls` from your home directory: + +{% filename %}command-line{% endfilename %} +``` +$ mkdir djangogirls +$ cd djangogirls +``` + +We will make a virtualenv called `myvenv`. The general command will be in the format: + +{% filename %}command-line{% endfilename %} +``` +$ python3 -m venv myvenv +``` + +We can create a `virtualenv` on OS X by running `python3 -m venv myvenv`. It will look like this: + +{% filename %}command-line{% endfilename %} +``` +$ python3 -m venv myvenv +``` + +`myvenv` is the name of your `virtualenv`. You can use any other name, but stick to lowercase and use no spaces. It is also +a good idea to keep the name short as you'll be referencing it a lot! + +## Working with virtualenv + +The command above will create a directory called `myvenv` (or whatever name you chose) that contains our virtual environment +(basically a bunch of directories and files). + +Start your virtual environment by running: + +{% filename %}command-line{% endfilename %} +``` +$ source myvenv/bin/activate +``` + +Remember to replace `myvenv` with your chosen `virtualenv` name! + +> __NOTE:__ If the command `source` is not available, try doing this instead: +> +>{% filename %}command-line{% endfilename %} +>``` +>$ . myvenv/bin/activate +>``` + +You will know that you have `virtualenv` started when you see that the prompt +in your console is prefixed with `(myvenv)`. + +When working within a virtual environment, `python` will automatically refer to the correct version so you can use +`python` instead of `python3`. + +OK, we have all important dependencies in place. We can finally install Django! + +## Installing Django {#django} + +Now that you have your `virtualenv` started, you can install Django. + +Before we do that, we should make sure we have the latest version of `pip`, the software that we use to install Django: + +{% filename %}command-line{% endfilename %} +``` +(myvenv) ~$ python -m pip install --upgrade pip +``` + +### Installing packages with requirements + +A requirements file keeps a list of dependencies to be installed using `pip install`: + +First create a `requirements.txt` file inside of the `djangogirls/` folder, u sing the code editor that you installed earlier. +You do this by opening a new file in the code editor and then saving it as`requirements.txt` in the `djangogirls/` folder. +Your directory will look like this: + +``` +djangogirls +├── myvenv +│ └── ... +└───requirements.txt +``` + +In your `djangogirls/requirements.txt` file you should add the following text: + +{% filename %}djangogirls/requirements.txt{% endfilename %} +``` +Django~={{ book.django_version }} +``` + +Now, run `pip install -r requirements.txt` to install Django. + +{% filename %}command-line{% endfilename %} +``` +(myvenv) ~$ pip install -r requirements.txt +Collecting Django~={{ book.django_version }} (from -r requirements.txt (line 1)) + Downloading Django-{{ book.django_version }}-py3-none-any.whl (7.9MB) +Installing collected packages: Django +Successfully installed Django-{{ book.django_version }} +``` + +That's it! You're now (finally) ready to create a Django application! diff --git a/en/macosx/django_start_project/README.md b/en/macosx/django_start_project/README.md new file mode 100644 index 00000000000..a30628ccfdc --- /dev/null +++ b/en/macosx/django_start_project/README.md @@ -0,0 +1,195 @@ +# Your first Django project! + +> Part of this chapter is based on tutorials by Geek Girls Carrots (https://github.com/ggcarrots/django-carrots). + +> Parts of this chapter are based on the [django-marcador +tutorial](http://django-marcador.keimlink.de/) licensed under the Creative Commons +Attribution-ShareAlike 4.0 International License. The django-marcador tutorial +is copyrighted by Markus Zapke-Gründemann et al. + +We're going to create a small blog! + +The first step is to start a new Django project. Basically, this means that we'll run some scripts provided by Django that will +create the skeleton of a Django project for us. This is just a bunch of directories and files that we will use later. + +The names of some files and directories are very important for Django. You should not rename the files that we are about +to create. Moving them to a different place is also not a good idea. Django needs to maintain a certain structure to be +able to find important things. + +> Remember to run everything in the virtualenv. If you don't see a prefix `(myvenv)` in your console, you need to activate +your virtualenv. We explained how to do that in the __Django installation__ chapter in the __Working with virtualenv__ part. +Typing `source myvenv/bin/activate` on Mac OS X will do this for you. + +In your Mac OS X, you should run the following command. **Don't forget to add the period (or dot) `.` at the end!** + +{% filename %}command-line{% endfilename %} +``` +(myvenv) ~/djangogirls$ django-admin startproject mysite . +``` + +> The period `.` is crucial because it tells the script to install Django in your current directory (for which the period `.` +is a short-hand reference). + +> **Note** When typing the command above, remember that you only type the part which starts by `django-admin`. The +`(myvenv) ~/djangogirls$` part shown here is just example of the prompt that will be inviting your input on your command line. + +`django-admin.py` is a script that will create the directories and files for you. You should now have a directory structure +which looks like this: + +``` +djangogirls +├── manage.py +├── mysite +│   ├── asgi.py +│   ├── __init__.py +│   ├── settings.py +│   ├── urls.py +│   └── wsgi.py +├── myvenv +│   └── ... +└── requirements.txt +``` +> **Note**: in your directory structure, you will also see your `myvenv` directory that we created before. + +`manage.py` is a script that helps with management of the site. With it we will be able (amongst other things) to start a +web server on our computer without installing anything else. + +The `settings.py` file contains the configuration of your website. + +Remember when we talked about a mail carrier checking where to deliver a letter? `urls.py` file contains a list of patterns +used by `urlresolver`. + +Let's ignore the other files for now as we won't change them. The only thing to remember is not to delete them by accident! + + +## Changing settings + +Let's make some changes in `mysite/settings.py`. Open the file using the code editor you installed earlier. + +**Note**: Keep in mind that `settings.py` is a regular file, like any other. You can open it from inside the code editor, +using the "file -> open" menu actions. This should get you the usual window in which you can navigate to your `settings.py` +file and select it. Alternatively, you can open the file by navigating to the djangogirls folder on your desktop and +right-clicking on it. Then, select your code editor from the list. Selecting the editor is important as you might have +other programs installed that can open the file but will not let you edit it. + +It would be nice to have the correct time on our website. Go to [Wikipedia's list of time zones](https://en.wikipedia.org/wiki/List_of_tz_database_time_zones) +and copy your relevant time zone (TZ) (e.g. `Europe/Berlin`). + +In `settings.py`, find the line that contains `TIME_ZONE` and modify it to choose your own timezone. For example: + +{% filename %}mysite/settings.py{% endfilename %} +```python +TIME_ZONE = 'Europe/Berlin' +``` + +A language code consist of the language, e.g. `en` for English or `de` for German, and the country code, e.g. `de` for Germany +or `ch` for Switzerland. If English is not your native language, you can add this to change the default buttons and notifications +from Django to be in your language. So you would have "Cancel" button translated into the language you defined here. +[Django comes with a lot of prepared translations](https://docs.djangoproject.com/en/3.2/ref/settings/#language-code). + +If you want a different language, change the language code by changing the following line: + +{% filename %}mysite/settings.py{% endfilename %} +```python +LANGUAGE_CODE = 'de-ch' +``` + + +We'll also need to add a path for static files. (We'll find out all about static files and CSS later in the tutorial.) +Go down to the *end* of the file, and just underneath the `STATIC_URL` entry, add a new one called `STATIC_ROOT`: + +{% filename %}mysite/settings.py{% endfilename %} +```python +STATIC_URL = '/static/' +STATIC_ROOT = BASE_DIR / 'static' +``` + +When `DEBUG` is `True` and `ALLOWED_HOSTS` is empty, the host is validated against `['localhost', '127.0.0.1', '[::1]']`. +This won't match our hostname on PythonAnywhere once we deploy our application so we will change the following setting: + +{% filename %}mysite/settings.py{% endfilename %} +```python +ALLOWED_HOSTS = ['127.0.0.1', '.pythonanywhere.com'] +``` + +## Set up a database + +There's a lot of different database software that can store data for your site. We'll use the default one, `sqlite3`. + +This is already set up in this part of your `mysite/settings.py` file: + +{% filename %}mysite/settings.py{% endfilename %} +```python +DATABASES = { + 'default': { + 'ENGINE': 'django.db.backends.sqlite3', + 'NAME': BASE_DIR / 'db.sqlite3', + } +} +``` + +To create a database for our blog, let's run the following in the console: `python manage.py migrate` (we need to be in +the `djangogirls` directory that contains the `manage.py` file). If that goes well, you should see something like this: + +{% filename %}command-line{% endfilename %} +``` +(myvenv) ~/djangogirls$ python manage.py migrate +Operations to perform: + Apply all migrations: admin, auth, contenttypes, sessions +Running migrations: + Applying contenttypes.0001_initial... OK + Applying auth.0001_initial... OK + Applying admin.0001_initial... OK + Applying admin.0002_logentry_remove_auto_add... OK + Applying admin.0003_logentry_add_action_flag_choices... OK + Applying contenttypes.0002_remove_content_type_name... OK + Applying auth.0002_alter_permission_name_max_length... OK + Applying auth.0003_alter_user_email_max_length... OK + Applying auth.0004_alter_user_username_opts... OK + Applying auth.0005_alter_user_last_login_null... OK + Applying auth.0006_require_contenttypes_0002... OK + Applying auth.0007_alter_validators_add_error_messages... OK + Applying auth.0008_alter_user_username_max_length... OK + Applying auth.0009_alter_user_last_name_max_length... OK + Applying auth.0010_alter_group_name_max_length... OK + Applying auth.0011_update_proxy_permissions... OK + Applying auth.0012_alter_user_first_name_max_length... OK + Applying sessions.0001_initial... OK +``` + +And we're done! Time to start the web server and see if our website is working! + +## Starting the web server + +You need to be in the directory that contains the `manage.py` file (the `djangogirls` directory). In the console, we can +start the web server by running `python manage.py runserver`: + +{% filename %}command-line{% endfilename %} +``` +(myvenv) ~/djangogirls$ python manage.py runserver +``` + +Now you need to check that your website is running. Open your browser (Firefox, Chrome, Safari, Internet Explorer or +whatever you use) and enter this address: + +{% filename %}browser{% endfilename %} +``` +http://127.0.0.1:8000/ +``` + +Congratulations! You've just created your first website and run it using a web server! Isn't that awesome? + +![Install worked!](images/install_worked.png) + +Note that a command window can only run one thing at a time, and the command window you opened earlier is running the web server. +As long as the web server is running and waiting for additional incoming requests, the terminal will accept new text but will +not execute new commands. + +> We reviewed how web servers work in the How the Internet works chapter. + +To type additional commands while the web server is running, open a new terminal window and activate your virtualenv -- to review +instructions on how to open a second terminal window, see [Introduction to the command line](../intro_to_command_line/README.md). +To stop the web server, switch back to the window in which it's running and press CTRL+C - Control and C keys together (on Windows, +you might have to press Ctrl+Break). + +Ready for the next step? It's time to create some content! diff --git a/en/macosx/django_start_project/images/install_worked.png b/en/macosx/django_start_project/images/install_worked.png new file mode 100644 index 00000000000..4354c634ddb Binary files /dev/null and b/en/macosx/django_start_project/images/install_worked.png differ diff --git a/en/macosx/intro_to_command_line/README.md b/en/macosx/intro_to_command_line/README.md new file mode 100644 index 00000000000..90bc0d611c6 --- /dev/null +++ b/en/macosx/intro_to_command_line/README.md @@ -0,0 +1,251 @@ +# Introduction to the command-line interface + +> For readers at home: this chapter is covered in the[Your new friend: Command Line](https://www.youtube.com/watch?v=jvZLWhkzX-8) +video. + +It's exciting, right?! You'll write your first line of code in just a few minutes! :) + +__Let us introduce you to your first new friend: the command line!__ + +The following steps will show you how to use the black window all hackers use. It might look a bit scary at first but really it's +just a prompt waiting for commands from you. + +> **Note** Please note that throughout this book we use the terms 'directory' and 'folder' interchangeably but they are one and +the same thing. + +## What is the command line? + +The window, which is usually called the __command line__ or __command-line interface__, is a text-based application for viewing, +handling, and manipulating files on your computer. It's much like Windows Explorer or Finder on the Mac, but without the graphical +interface. Other names for the command line are: *cmd*, *CLI*, *prompt*, *console* or *terminal*. + +## Open the command-line interface + +To start some experiments we need to open our command-line interface first. + +Go to Applications → Utilities → Terminal. + +## Prompt + +You now should see a white or black window that is waiting for your commands. + +On Mac, you will probably see a `$`, like this: + +{% filename %}command-line{% endfilename %} +``` +$ +``` + +Each command will be prepended by a `$` and one space, but you should not type it. Your computer will do it for you. :) + +> Just a small note: in your case there may be something like `Olas-MacBook-Air:~ ola$` before the prompt sign, and this +is 100% OK. + +The part up to and including the `$` or the `>` is called the *command line prompt*, or *prompt* for short. It prompts you +to input something there. + +In the tutorial, when we want you to type in a command, we will include the `$`, and occasionally more to the left. Ignore +the left part and only type in the command, which starts after the prompt. + +## Your first command (YAY!) + +Let's start by typing this command: + +{% filename %}command-line{% endfilename %} +``` +$ whoami +``` + +And then hit `enter`. This is our result: + +{% filename %}command-line{% endfilename %} +``` +$ whoami +olasitarska +``` + +As you can see, the computer has just printed your username. Neat, huh? :) + +> Try to type each command; do not copy-paste. You'll remember more this way! + +## Basics + +Each operating system has a slightly different set of commands for the command line, so make sure to follow instructions for your +operating system. Let's try this, shall we? + +### Current directory + +It'd be nice to know where are we now, right? Let's see. Type this command and hit `enter`: + +{% filename %}command-line{% endfilename %} +``` +$ pwd +/Users/olasitarska +``` + +> Note: 'pwd' stands for 'print working directory'. + +You'll probably see something similar on your machine. Once you open the command line you usually start at your user's home +directory. + +--- + +### Learn more about a command + +Many commands you can type at the command prompt have built-in help that you can display and read! For example, to learn more +about the current directory command: + +OS X has a `man` command, which gives you help on commands. Try `man pwd` and see what it says, or put `man` before other +commands to see their help. The output of `man` is normally paged. Use the space bar to move to the next page, and `q` to quit +looking at the help. + +### List files and directories + +So what's in it? It'd be cool to find out. Let's see: + +{% filename %}command-line{% endfilename %} +``` +$ ls +Applications +Desktop +Downloads +Music +... +``` + +--- + +### Change current directory + +Now, let's go to our Desktop directory: + +{% filename %}command-line{% endfilename %} +``` +$ cd Desktop +``` + +Check if it's really changed: + +{% filename %}command-line{% endfilename %} +``` +$ pwd +/Users/olasitarska/Desktop +``` + +Here it is! + +> PRO tip: if you type `cd D` and then hit `tab` on your keyboard, the command line will automatically fill in the rest of the name +so you can navigate faster. If there is more than one folder starting with "D", hit the `tab` key twice to get a list of options. + +--- + +### Create directory + +How about creating a practice directory on your desktop? You can do it this way: + +{% filename %}command-line{% endfilename %} +``` +$ mkdir practice +``` + +This little command will create a folder with the name `practice` on your desktop. You can check if it's there by looking on your +Desktop or by running a `ls` or `dir` command! Try it. :) + +> PRO tip: If you don't want to type the same commands over and over, try pressing the `up arrow` and `down arrow` on your +keyboard to cycle through recently used commands. + +--- + +### Exercise! + +A small challenge for you: in your newly created `practice` directory, create a directory called `test`. (Use the `cd` and `mkdir` +commands.) + +#### Solution: + +{% filename %}command-line{% endfilename %} +``` +$ cd practice +$ mkdir test +$ ls +test +``` + +Congrats! :) + +--- + +### Clean up + +We don't want to leave a mess, so let's remove everything we did until that point. + +First, we need to get back to Desktop: + +{% filename %}command-line{% endfilename %} +``` +$ cd .. +``` + +Using `..` with the `cd` command will change your current directory to the parent directory (that is, the directory that contains +your current directory). + +Check where you are: + +{% filename %}command-line{% endfilename %} +``` +$ pwd +/Users/olasitarska/Desktop +``` + +Now time to delete the `practice` directory: + +> __Attention__: Deleting files using `del`, `rmdir` or `rm` is irrecoverable, meaning _the deleted files will be gone forever_! +So be very careful with this command. + +{% filename %}command-line{% endfilename %} +``` +$ rm -r practice +``` + +Done! To be sure it's actually deleted, let's check it: + +{% filename %}command-line{% endfilename %} +``` +$ ls +``` + +### Exit + +That's it for now! You can safely close the command line now. Let's do it the hacker way, alright? :) + +{% filename %}command-line{% endfilename %} +``` +$ exit +``` + +Cool, huh? :) + +## Summary + + Here is a summary of some useful commands: + +Command (Windows) | Command (Mac OS / Linux) | Description | Example +----------------- | ------------------------ | -------------------------- | --------------------------------------------- +exit | exit | close the window | **exit** +cd | cd | change directory | **cd test** +cd | pwd | show the current directory | **cd** (Windows) or **pwd** (Mac OS / Linux) +dir | ls | list directories/files | **dir** +copy | cp | copy file | **copy c:\test\test.txt c:\windows\test.txt** +move | mv | move file | **move c:\test\test.txt c:\windows\test.txt** +mkdir | mkdir | create a new directory | **mkdir testdirectory** +rmdir (or del) | rm | delete a file | **del c:\test\test.txt** +rmdir /S | rm -r | delete a directory | **rm -r testdirectory** +[CMD] /? | man [CMD] | get help for a command | **cd /?** (Windows) or **man cd** (Mac OS / Linux) + +These are just a very few of the commands you can run in your command line, but you're not going to use anything more than that today. + +If you're curious, [ss64.com](http://ss64.com) contains a complete reference of commands for all operating systems. + +## Ready? + +Let's dive into Python! diff --git a/en/macosx/intro_to_command_line/open_instructions.md b/en/macosx/intro_to_command_line/open_instructions.md new file mode 100644 index 00000000000..f6a68d0a3af --- /dev/null +++ b/en/macosx/intro_to_command_line/open_instructions.md @@ -0,0 +1,5 @@ +## Open the command-line interface + +To start some experiments we need to open our command-line interface first. + +Go to Applications → Utilities → Terminal. \ No newline at end of file diff --git a/en/macosx/python_installation/README.md b/en/macosx/python_installation/README.md new file mode 100644 index 00000000000..e8c8d2481c0 --- /dev/null +++ b/en/macosx/python_installation/README.md @@ -0,0 +1,7 @@ +# Python installation + +> **Note** If you already worked through the installation steps, there's no need to do this again – you can skip straight ahead +to the next chapter! + +{% include "instructions.md" %} + diff --git a/en/macosx/python_installation/images/python-installation-options.png b/en/macosx/python_installation/images/python-installation-options.png new file mode 100644 index 00000000000..a0a6c65d81d Binary files /dev/null and b/en/macosx/python_installation/images/python-installation-options.png differ diff --git a/en/macosx/python_installation/images/windows-plus-r.png b/en/macosx/python_installation/images/windows-plus-r.png new file mode 100644 index 00000000000..4f8f7433381 Binary files /dev/null and b/en/macosx/python_installation/images/windows-plus-r.png differ diff --git a/en/macosx/python_installation/instructions.md b/en/macosx/python_installation/instructions.md new file mode 100644 index 00000000000..c5235220182 --- /dev/null +++ b/en/macosx/python_installation/instructions.md @@ -0,0 +1,33 @@ +> For readers at home: this chapter is covered in the[Installing Python & Code Editor](https://www.youtube.com/watch?v=pVTaqzKZCdA) +video. + +> This section is based on a tutorial by Geek Girls Carrots (https://github.com/ggcarrots/django-carrots) + +Django is written in Python. We need Python to do anything in Django. Let's start by installing it! We want you to install the +latest version of Python 3, so if you have any earlier version, you will need to upgrade it. If you already have version +{{ book.py_min_version }} or higher you should be fine. + +Please install normal Python as follows, even when you have Anaconda installed on your computer. + +> **Note** Before you install Python on OS X, you should ensure your Mac settings allow installing packages that aren't from the +App Store. Go to System Preferences (it's in the Applications folder), click"Security & Privacy," and then the "General" tab. +If your "Allow apps downloaded from:" is set to "Mac App Store," change it to "Mac App Store and identified developers." + +You need to go to the website https://www.python.org/downloads/mac-osx/ and download the latest Python installer: + +* Download the *Mac OS X 64-bit/32-bit installer* file, +* Double click *python-{{ book.py_release }}-macosx10.9.pkg* to run the installer. + +Verify the installation was successful by opening a command prompt and running the `python3` command: + +{% filename %}command-line{% endfilename %} +``` +$ python3 --version +Python {{ book.py_release }} +``` +The version shown may be different from {{ book.py_release }} -- it should match the version you installed. + +---- + +If you have any doubts, or if something went wrong and you have no idea what to do next, please ask your coach! Sometimes things +don't go smoothly and it's better to ask for help from someone with more experience. diff --git a/en/macosx/python_introduction/README.md b/en/macosx/python_introduction/README.md new file mode 100644 index 00000000000..bfc82a266dd --- /dev/null +++ b/en/macosx/python_introduction/README.md @@ -0,0 +1,16 @@ +{% set warning_icon = '' %} + +# Introduction to Python + +> Part of this chapter is based on tutorials by Geek Girls Carrots +(https://github.com/ggcarrots/django-carrots). + +Let's write some code! + +{% include "prompt.md" %} + +{% include "/python_introduction/instructions.md" %} + +{% include "instructions.md" %} + +{% include "/python_introduction/instructions_part_two.md" %} \ No newline at end of file diff --git a/en/macosx/python_introduction/images/cupcake.png b/en/macosx/python_introduction/images/cupcake.png new file mode 100644 index 00000000000..8c1820adee8 Binary files /dev/null and b/en/macosx/python_introduction/images/cupcake.png differ diff --git a/en/macosx/python_introduction/instructions.md b/en/macosx/python_introduction/instructions.md new file mode 100644 index 00000000000..5ed40ffee22 --- /dev/null +++ b/en/macosx/python_introduction/instructions.md @@ -0,0 +1,17 @@ +On Mac OSX, the command will look something like this: + +{% filename %}command-line{% endfilename %} +``` +$ cd ~/Desktop +``` + +If you get stuck, ask for help. +That's exactly what the coaches are here for! + +Now use Python to execute the code in the file like this: + +{% filename %}command-line{% endfilename %} +``` +$ python3 python_intro.py +Hello, Django girls! +``` \ No newline at end of file diff --git a/en/macosx/python_introduction/prompt.md b/en/macosx/python_introduction/prompt.md new file mode 100644 index 00000000000..11e5b6c1244 --- /dev/null +++ b/en/macosx/python_introduction/prompt.md @@ -0,0 +1,20 @@ +## Python prompt + +> For readers at home: this part is covered in the +[Python Basics: Integers, Strings, Lists, Variables and Errors](https://www.youtube.com/watch?v=MO63L4s-20U) video. + +To start playing with Python, we need to open up a *command line* on your computer. +You should already know how to do that – you learned it in the +[Intro to Command Line](../intro_to_command_line/README.md) chapter. + +Once you're ready, follow the instructions below. + +We want to open up a Python console, so type in `python3` on Mac OSX and hit `enter`. + +{% filename %}command-line{% endfilename %} +``` +$ python3 +Python {{ book.py_release }} (...) +Type "help", "copyright", "credits" or "license" for more information. +>>> +``` diff --git a/en/python_installation/README.md b/en/python_installation/README.md index d03e285e533..2037eff27c5 100644 --- a/en/python_installation/README.md +++ b/en/python_installation/README.md @@ -2,17 +2,21 @@ We're finally here! -But first, let us tell you what Python is. Python is a very popular programming language that can be used for creating websites, games, scientific software, graphics, and much, much more. +But first, let us tell you what Python is. Python is a very popular programming language that can be used for creating websites, games, +scientific software, graphics, and much, much more. -Python originated in the late 1980s and its main goal is to be readable by human beings (not only machines!). This is why it looks simpler than other programming languages, but don't worry – Python is also really powerful! +Python originated in the late 1980s and its main goal is to be readable by human beings (not only machines!). This is why it looks +simpler than other programming languages, but don't worry – Python is also really powerful! -# Python installation +# Python Installation +> **Note** If you already worked through the [installation steps](../README.md), there's no need to do this again – you +> can skip straight ahead to the next chapter! +> +> **Note** If you are on RunCode, this step is unnecessary since Python is pre-installed - you can skip right ahead to +> the next chapter! -> **Note** If you're using a Chromebook, skip this chapter and make sure you follow the [Chromebook Setup](../chromebook_setup/README.md) instructions. - -> **Note** If you already worked through the [installation steps](../installation/README.md), there's no need to do this again – you can skip straight ahead to the next chapter! - -> **Note** If you're using [RunCode cloud environment](../cloud_development_setup/README.md), you do not need to install Python as it is pre-installed on their platform so you can skip straight ahead to the next chapter! - -{% include "/python_installation/instructions.md" %} +To install Python, pick your operating system below: +* [ChromeBook/Linux](../linux/python_installation/README.md) +* [Mac OSX](../macosx/python_installation/README.md) +* [Windows](../windows/python_installation/README.md) \ No newline at end of file diff --git a/en/python_installation/instructions.md b/en/python_installation/instructions.md deleted file mode 100644 index 4365eea826d..00000000000 --- a/en/python_installation/instructions.md +++ /dev/null @@ -1,115 +0,0 @@ -> For readers at home: this chapter is covered in the [Installing Python & Code Editor](https://www.youtube.com/watch?v=pVTaqzKZCdA) video. - -> This section is based on a tutorial by Geek Girls Carrots (https://github.com/ggcarrots/django-carrots) - -Django is written in Python. We need Python to do anything in Django. Let's start by installing it! We want you to install the latest version of Python 3, so if you have any earlier version, you will need to upgrade it. If you already have version {{ book.py_min_version }} or higher you should be fine. - -Please install normal Python as follows, even when you have Anaconda installed on your computer. - - - -First check whether your computer is running a 32-bit version or a 64-bit version of Windows, on the "System type" line of the System Info page. To reach this page, try one of these methods: -* Press the Windows key and Pause/Break key at the same time -* Open your Control Panel from the Windows menu, then navigate to System & Security, then System -* Press the Windows button, then navigate to Settings > System > About -* Search the Windows Start menu for "System Information". To do that, click the Start button or press the Windows key, then begin to type `System Information`. It will start making suggestions as soon as you type. You can select the entry once it shows up. - -You can download Python for Windows from the website https://www.python.org/downloads/windows/. Click on the "Latest Python 3 Release - Python x.x.x" link. If your computer is running a **64-bit** version of Windows, download the **Windows x86-64 executable installer**. Otherwise, download the **Windows x86 executable installer**. After downloading the installer, you should run it (double-click on it) and follow the instructions there. - -One thing to watch out for: During the installation, you will notice a window marked "Setup". Make sure you tick the "Add Python {{ book.py_version }} to PATH" or 'Add Python to your environment variables" checkbox and click on "Install Now", as shown here (it may look a bit different if you are installing a different version): - -![Don't forget to add Python to the Path](../python_installation/images/python-installation-options.png) - -When the installation completes, you may see a dialog box with a link you can follow to learn more about Python or about the version you installed. Close or cancel that dialog -- you'll be learning more in this tutorial! - -Note: If you are using an older version of Windows (7, Vista, or any older version) and the Python {{ book.py_version }} installer fails with an error, then install all Windows Updates and try to install Python again. If you still have the error, try installing Python version {{ book.py_min_release }} from [Python.org](https://www.python.org/downloads/windows/). - -> Django {{ book.django_version }} needs Python {{ book.py_min_version }} or greater, which does not support Windows XP or earlier versions. - - - - - -> **Note** Before you install Python on OS X, you should ensure your Mac settings allow installing packages that aren't from the App Store. Go to System Preferences (it's in the Applications folder), click "Security & Privacy," and then the "General" tab. If your "Allow apps downloaded from:" is set to "Mac App Store," change it to "Mac App Store and identified developers." - -You need to go to the website https://www.python.org/downloads/mac-osx/ and download the latest Python installer: - -* Download the *Mac OS X 64-bit/32-bit installer* file, -* Double click *python-{{ book.py_release }}-macosx10.9.pkg* to run the installer. - - - - - -It is very likely that you already have Python installed out of the box. To check if you have it installed (and which version it is), open a console and type the following command: - -{% filename %}command-line{% endfilename %} -``` -$ python3 --version -Python {{ book.py_release }} -``` - -If you have a different version of Python installed, at least {{ book.py_min_version }} (e.g. {{ book.py_min_release }}), then you don't have to upgrade. If you don't have Python installed, or if you want a different version, first check what Linux distribution you are using with the following command: - -{% filename %}command-line{% endfilename %} -``` -$ grep '^NAME=' /etc/os-release -``` - -Afterwards, depending on the result, follow one of the following installation guides below this section. - - - - - -Type this command into your console: - -{% filename %}command-line{% endfilename %} -``` -$ sudo apt install python3 -``` - - - - - -Use this command in your console: - -{% filename %}command-line{% endfilename %} -``` -$ sudo dnf install python3 -``` - -If you're on older Fedora versions you might get an error that the command `dnf` is not found. In that case, you need to use `yum` instead. - - - - - -Use this command in your console: - -{% filename %}command-line{% endfilename %} -``` -$ sudo zypper install python3 -``` - - - -Verify the installation was successful by opening a command prompt and running the `python3` command: - -{% filename %}command-line{% endfilename %} -``` -$ python3 --version -Python {{ book.py_release }} -``` -The version shown may be different from {{ book.py_release }} -- it should match the version you installed. - -**NOTE:** If you're on Windows and you get an error message that `python3` wasn't found, try using `python` (without the `3`) and check if it still might be a version of Python that is {{ book.py_min_version }} or higher. If that doesn't work either, you may open a new command prompt and try again; this happens if you use a command prompt left open from before the Python installation. - ----- - -If you have any doubts, or if something went wrong and you have no idea what to do next, please ask your coach! Sometimes things don't go smoothly and it's better to ask for help from someone with more experience. diff --git a/en/python_introduction/README.md b/en/python_introduction/README.md index f30dc47334f..723b7d2ae77 100644 --- a/en/python_introduction/README.md +++ b/en/python_introduction/README.md @@ -1,1002 +1,7 @@ -{% set warning_icon = '' %} - # Introduction to Python -> Part of this chapter is based on tutorials by Geek Girls Carrots (https://github.com/ggcarrots/django-carrots). - -Let's write some code! - -{% include "/python_introduction/prompt.md" %} - -## Your first Python command! - -After running the Python command, the prompt changed to `>>>`. For us this means that for now we may only use commands in the Python language. You don't have to type in `>>>` – Python will do that for you. - -If you want to exit the Python console at any point, type `exit()` or use the shortcut `Ctrl + Z` for Windows and `Ctrl + D` for Mac/Linux. Then you won't see `>>>` any longer. - -For now, we don't want to exit the Python console. We want to learn more about it. Let's start by typing some math, like `2 + 3` and hitting `enter`. - -{% filename %}command-line{% endfilename %} -```python ->>> 2 + 3 -5 -``` - -Nice! See how the answer popped out? Python knows math! You could try other commands like: - -- `4 * 5` -- `5 - 1` -- `40 / 2` - -To perform exponential calculation, say 2 to the power 3, we type: -{% filename %}command-line{% endfilename %} -```python ->>> 2 ** 3 -8 -``` - -Have fun with this for a little while and then get back here. :) - -As you can see, Python is a great calculator. If you're wondering what else you can do… - -## Strings - -How about your name? Type your first name in quotes like this: - -{% filename %}command-line{% endfilename %} -```python ->>> "Ola" -'Ola' -``` - -You've now created your first string! It's a sequence of characters that can be processed by a computer. The string must always begin and end with the same character. This may be single (`'`) or double (`"`) quotes (there is no difference!) The quotes tell Python that what's inside of them is a string. - -Strings can be strung together. Try this: - -{% filename %}command-line{% endfilename %} -```python ->>> "Hi there " + "Ola" -'Hi there Ola' -``` - -You can also multiply strings with a number: - -{% filename %}command-line{% endfilename %} -```python ->>> "Ola" * 3 -'OlaOlaOla' -``` - -If you need to put an apostrophe inside your string, you have two ways to do it. - -Using double quotes: - -{% filename %}command-line{% endfilename %} -```python ->>> "Runnin' down the hill" -"Runnin' down the hill" -``` - -or escaping the apostrophe with a backslash (`\`): - -{% filename %}command-line{% endfilename %} -```python ->>> 'Runnin\' down the hill' -"Runnin' down the hill" -``` - -Nice, huh? To see your name in uppercase letters, type: - -{% filename %}command-line{% endfilename %} -```python ->>> "Ola".upper() -'OLA' -``` - -You just used the `upper` __method__ on your string! A method (like `upper()`) is a sequence of instructions that Python has to perform on a given object (`"Ola"`) once you call it. - -If you want to know the number of letters contained in your name, there is a __function__ for that too! - -{% filename %}command-line{% endfilename %} -```python ->>> len("Ola") -3 -``` - -Wonder why sometimes you call functions with a `.` at the end of a string (like `"Ola".upper()`) and sometimes you first call a function and place the string in parentheses? Well, in some cases, functions belong to objects, like `upper()`, which can only be performed on strings. In this case, we call the function a __method__. Other times, functions don't belong to anything specific and can be used on different types of objects, just like `len()`. That's why we're giving `"Ola"` as a parameter to the `len` function. - -### Summary - -OK, enough of strings. So far you've learned about: - -- __the prompt__ – typing commands (code) into the Python prompt results in answers in Python -- __numbers and strings__ – in Python numbers are used for math and strings for text objects -- __operators__ – like `+` and `*`, combine values to produce a new one -- __functions__ – like `upper()` and `len()`, perform actions on objects. - -These are the basics of every programming language you learn. Ready for something harder? We bet you are! - -## Errors - -Let's try something new. Can we get the length of a number the same way we could find out the length of our name? Type in `len(304023)` and hit `enter`: - -{% filename %}{{ warning_icon }} command-line{% endfilename %} -```python ->>> len(304023) -Traceback (most recent call last): - File "", line 1, in -TypeError: object of type 'int' has no len() -``` - -We got our first error! The {{ warning_icon }} icon is our way of giving you a heads up that the code you are about to run won't work as expected. Making mistakes (even intentional ones) are an important part of learning! - - It says that objects of type "int" (integers, whole numbers) have no length. So what can we do now? Maybe we can write our number as a string? Strings have a length, right? - -{% filename %}command-line{% endfilename %} -```python ->>> len(str(304023)) -6 -``` - -It worked! We used the `str` function inside of the `len` function. `str()` converts everything to strings. - -- The `str` function converts things into __strings__ -- The `int` function converts things into __integers__ - -> Important: we can convert numbers into text, but we can't necessarily convert text into numbers – what would `int('hello')` be anyway? - -## Variables - -An important concept in programming is variables. A variable is nothing more than a name for something so you can use it later. Programmers use these variables to store data, make their code more readable and so they don't have to keep remembering what things are. - -Let's say we want to create a new variable called `name`: - -{% filename %}command-line{% endfilename %} -```python ->>> name = "Ola" -``` - -We type name equals Ola. - -As you've noticed, your program didn't return anything like it did before. So how do we know that the variable actually exists? Enter `name` and hit `enter`: - -{% filename %}command-line{% endfilename %} -```python ->>> name -'Ola' -``` - -Yippee! Your first variable! :) You can always change what it refers to: - -{% filename %}command-line{% endfilename %} -```python ->>> name = "Sonja" ->>> name -'Sonja' -``` - -You can use it in functions too: - -{% filename %}command-line{% endfilename %} -```python ->>> len(name) -5 -``` - -Awesome, right? Now, variables can be anything – numbers too! Try this: - -{% filename %}command-line{% endfilename %} -```python ->>> a = 4 ->>> b = 6 ->>> a * b -24 -``` - -But what if we used the wrong name? Can you guess what would happen? Let's try! - -{% filename %}{{ warning_icon }} command-line{% endfilename %} -```python ->>> city = "Tokyo" ->>> ctiy -Traceback (most recent call last): - File "", line 1, in -NameError: name 'ctiy' is not defined -``` - -An error! As you can see, Python has different types of errors and this one is called a **NameError**. Python will give you this error if you try to use a variable that hasn't been defined yet. If you encounter this error later, check your code to see if you've mistyped any names. - -Play with this for a while and see what you can do! - - -## The print function - -Try this: - -{% filename %}command-line{% endfilename %} -```python ->>> name = 'Maria' ->>> name -'Maria' ->>> print(name) -Maria -``` - -When you just type `name`, the Python interpreter responds with the string *representation* of the variable 'name', which is the letters M-a-r-i-a, surrounded by single quotes, ''. When you say `print(name)`, Python will "print" the contents of the variable to the screen, without the quotes, which is neater. - -As we'll see later, `print()` is also useful when we want to print things from inside functions, or when we want to print things on multiple lines. - - -## Lists - -Beside strings and integers, Python has all sorts of different types of objects. Now we're going to introduce one called __list__. Lists are exactly what you think they are: objects which are lists of other objects. :) - -Go ahead and create a list: - -{% filename %}command-line{% endfilename %} -```python ->>> [] -[] -``` - -Yes, this list is empty. Not very useful, right? Let's create a list of lottery numbers. We don't want to repeat ourselves all the time, so we will put it in a variable, too: - -{% filename %}command-line{% endfilename %} -```python ->>> lottery = [3, 42, 12, 19, 30, 59] -``` - -All right, we have a list! What can we do with it? Let's see how many lottery numbers there are in a list. Do you have any idea which function you should use for that? You know this already! - -{% filename %}command-line{% endfilename %} -```python ->>> len(lottery) -6 -``` - -Yes! `len()` can give you a number of objects in a list. Handy, right? Maybe we will sort it now: - -{% filename %}command-line{% endfilename %} -```python ->>> lottery.sort() -``` - -This doesn't return anything, it just changed the order in which the numbers appear in the list. Let's print it out again and see what happened: - -{% filename %}command-line{% endfilename %} -```python ->>> print(lottery) -[3, 12, 19, 30, 42, 59] -``` - -As you can see, the numbers in your list are now sorted from the lowest to highest value. Congrats! - -Maybe we want to reverse that order? Let's do that! - -{% filename %}command-line{% endfilename %} -```python ->>> lottery.reverse() ->>> print(lottery) -[59, 42, 30, 19, 12, 3] -``` - -If you want to add something to your list, you can do this by typing this command: - -{% filename %}command-line{% endfilename %} -```python ->>> lottery.append(199) ->>> print(lottery) -[59, 42, 30, 19, 12, 3, 199] -``` - -If you want to show only the first number, you can do this by using __indexes__. An index is the number that says where in a list an item occurs. Programmers prefer to start counting at 0, so the first object in your list is at index 0, the next one is at 1, and so on. Try this: - -{% filename %}command-line{% endfilename %} -```python ->>> print(lottery[0]) -59 ->>> print(lottery[1]) -42 -``` - -As you can see, you can access different objects in your list by using the list's name and the object's index inside of square brackets. - -To delete something from your list you will need to use __indexes__ as we learned above and the `pop()` method. Let's try an example and reinforce what we learned previously; we will be deleting the first number of our list. - -{% filename %}command-line{% endfilename %} -```python ->>> print(lottery) -[59, 42, 30, 19, 12, 3, 199] ->>> print(lottery[0]) -59 ->>> lottery.pop(0) -59 ->>> print(lottery) -[42, 30, 19, 12, 3, 199] -``` - -That worked like a charm! - -For extra fun, try some other indexes: 6, 7, 1000, -1, -6 or -1000. See if you can predict the result before trying the command. Do the results make sense? - -You can find a list of all available list methods in this chapter of the Python documentation: https://docs.python.org/3/tutorial/datastructures.html - -## Dictionaries - -> For readers at home: this part is covered in the [Python Basics: Dictionaries](https://www.youtube.com/watch?v=ZX1CVvZLE6c) video. - -A dictionary is similar to a list, but you access values by looking up a key instead of a numeric index. A key can be any string or number. The syntax to define an empty dictionary is: - -{% filename %}command-line{% endfilename %} -```python ->>> {} -{} -``` - -This shows that you just created an empty dictionary. Hurray! - -Now, try writing the following command (try substituting your own information, too): - -{% filename %}command-line{% endfilename %} -```python ->>> participant = {'name': 'Ola', 'country': 'Poland', 'favorite_numbers': [7, 42, 92]} -``` - -With this command, you just created a variable named `participant` with three key–value pairs: - -- The key `name` points to the value `'Ola'` (a `string` object), -- `country` points to `'Poland'` (another `string`), -- and `favorite_numbers` points to `[7, 42, 92]` (a `list` with three numbers in it). - -You can check the content of individual keys with this syntax: - -{% filename %}command-line{% endfilename %} -```python ->>> print(participant['name']) -Ola -``` - -See, it's similar to a list. But you don't need to remember the index – just the name. - -What happens if we ask Python the value of a key that doesn't exist? Can you guess? Let's try it and see! - -{% filename %}{{ warning_icon }} command-line{% endfilename %} -```python ->>> participant['age'] -Traceback (most recent call last): - File "", line 1, in -KeyError: 'age' -``` - -Look, another error! This one is a **KeyError**. Python is helpful and tells you that the key `'age'` doesn't exist in this dictionary. - -When should you use a dictionary or a list? Well, that's a good point to ponder. Think about the answer before looking at it in the next line. - -- Do you just need an ordered sequence of items? Go for a list. -- Do you need to associate values with keys, so you can look them up efficiently (by key) later on? Use a dictionary. - -Like lists, using the `len()` function on the dictionaries returns the number of key–value pairs in the dictionary. Go ahead and type in this command: - -{% filename %}command-line{% endfilename %} -```python ->>> len(participant) -3 -``` - -Dictionaries, like lists, are *mutable*, meaning that they can be changed after they are created. You can add new key–value pairs to a dictionary after it is created, like this: - -{% filename %}command-line{% endfilename %} -```python ->>> participant['favorite_language'] = 'Python' -``` - -I hope it makes sense up to now. :) Ready for some more fun with dictionaries? Read on for some amazing things. - -You can use the `pop()` method to delete an item in the dictionary. Say, if you want to delete the entry corresponding to the key `'favorite_numbers'`, type in the following command: - -{% filename %}command-line{% endfilename %} -```python ->>> participant.pop('favorite_numbers') -[7, 42, 92] ->>> participant -{'country': 'Poland', 'favorite_language': 'Python', 'name': 'Ola'} -``` - -As you can see from the output, the key–value pair corresponding to the 'favorite_numbers' key has been deleted. - -As well as this, you can also change a value associated with an already-created key in the dictionary. Type this: - -{% filename %}command-line{% endfilename %} -```python ->>> participant['country'] = 'Germany' ->>> participant -{'country': 'Germany', 'favorite_language': 'Python', 'name': 'Ola'} -``` - -As you can see, the value of the key `'country'` has been altered from `'Poland'` to `'Germany'`. :) Exciting? Hurrah! You just learned another amazing thing. - -### Summary - -Awesome! You know a lot about programming now. In this last part you learned about: - -- __errors__ – you now know how to read and understand errors that show up if Python doesn't understand a command you've given it -- __variables__ – names for objects that allow you to code more easily and to make your code more readable -- __lists__ – lists of objects stored in a particular order -- __dictionaries__ – objects stored as key–value pairs - -Excited for the next part? :) - -## Compare things - -> For readers at home: this part is covered in the [Python Basics: Comparisons](https://www.youtube.com/watch?v=7bzxqIKYgf4) video. - -A big part of programming involves comparing things. What's the easiest thing to compare? Numbers! Let's see how that works: - -{% filename %}command-line{% endfilename %} -```python ->>> 5 > 2 -True ->>> 3 < 1 -False ->>> 5 > 2 * 2 -True ->>> 1 == 1 -True ->>> 5 != 2 -True ->>> len([1, 2, 3]) > len([4, 5]) -True -``` - -We gave Python some numbers to compare. As you can see, not only can Python compare numbers, but it can also compare values of mathematical expressions like `2 * 2` and function results like the `2` returned by `len([4, 5])`. Nice, huh? - -Do you wonder why we put two equal signs `==` next to each other to compare if numbers are equal? We use a single `=` for assigning values to variables. You always, __always__ need to put two of them – `==` – if you want to check if things are equal to each other. We can also state that things are unequal to each other. For that, we use the symbol `!=`, as shown in the example above. - -Give Python two more tasks: - -{% filename %}command-line{% endfilename %} -```python ->>> 6 >= 12 / 2 -True ->>> 3 <= 2 -False -``` - -We've seen `>` and `<`, but what do `>=` and `<=` mean? Read them like this: - -- x `>` y means: x is greater than y -- x `<` y means: x is less than y -- x `<=` y means: x is less than or equal to y -- x `>=` y means: x is greater than or equal to y - -Awesome! Wanna do one more? Try this: - -{% filename %}command-line{% endfilename %} -```python ->>> 6 > 2 and 2 < 3 -True ->>> 3 > 2 and 2 < 1 -False ->>> 3 > 2 or 2 < 1 -True -``` - -You can give Python as many numbers to compare as you want, and it will give you an answer! Pretty smart, right? - -- __and__ – if you use the `and` operator, both comparisons have to be True in order for the whole command to be True -- __or__ – if you use the `or` operator, only one of the comparisons has to be True in order for the whole command to be True - -Have you heard of the expression "comparing apples to oranges"? Let's try the Python equivalent: - -{% filename %}{{ warning_icon }} command-line{% endfilename %} -```python ->>> 1 > 'django' -Traceback (most recent call last): - File "", line 1, in -TypeError: '>' not supported between instances of 'int' and 'str' -``` - -Here you see that just like in the expression, Python is not able to compare a number (`int`) and a string (`str`). -Instead, it shows a **TypeError** and tells us the two types can't be compared together. - -## Boolean - -Incidentally, you just learned about a new type of object in Python. It's called __Boolean__. - -There are only two Boolean objects: -- True -- False - -But for Python to understand this, you need to always write it as 'True' (first letter uppercase, with the rest of the letters lowercased). __true, TRUE, and tRUE won't work – only True is correct.__ (The same applies to 'False' as well.) - -Booleans can be variables, too! See here: - -{% filename %}command-line{% endfilename %} -```python ->>> a = True ->>> a -True -``` - -You can also do it this way: - -{% filename %}command-line{% endfilename %} -```python ->>> a = 2 > 5 ->>> a -False -``` - -Practice and have fun with Booleans by trying to run the following commands: - -- `True and True` -- `False and True` -- `True or 1 == 1` -- `1 != 2` - -Congrats! Booleans are one of the coolest features in programming, and you just learned how to use them! - -# Save it! - -> For readers at home: this part is covered in the [Python Basics: Saving files and "If" statement](https://www.youtube.com/watch?v=dOAg6QVAxyk) video. - - -So far we've been writing all our python code in the interpreter, which limits us to entering one line of code at a time. Normal programs are saved in files and executed by our programming language __interpreter__ or __compiler__. So far we've been running our programs one line at a time in the Python __interpreter__. We're going to need more than one line of code for the next few tasks, so we'll quickly need to: - -- Exit the Python interpreter -- Open up our code editor of choice -- Save some code into a new python file -- Run it! - -To exit from the Python interpreter that we've been using, type the `exit()` function - -{% filename %}command-line{% endfilename %} -```python ->>> exit() -$ -``` - -This will put you back into the command prompt. - -Earlier, we picked out a code editor from the [code editor](../code_editor/README.md) section. We'll need to open the editor now and write some code into a new file (or if you're using a Chromebook, create a new file in the cloud IDE and open the file, which will be in the included code editor): - -{% filename %}editor{% endfilename %} -```python -print('Hello, Django girls!') -``` - -Obviously, you're a pretty seasoned Python developer now, so feel free to write some code that you've learned today. - -Now we need to save the file and give it a descriptive name. Let's call the file **python_intro.py** and save it to your desktop. We can name the file anything we want, but the important part here is to make sure the file ends in __.py__. The __.py__ extension tells our operating system that this is a **Python executable file** and Python can run it. - -> **Note** You should notice one of the coolest thing about code editors: colors! In the Python console, everything was the same color; now you should see that the `print` function is a different color from the string. This is called "syntax highlighting", and it's a really useful feature when coding. The color of things will give you hints, such as unclosed strings or a typo in a keyword name (like the `def` in a function, which we'll see below). This is one of the reasons we use a code editor. :) - - -With the file saved, it's time to run it! Using the skills you've learned in the command line section, use the terminal to **change directories** to the desktop. - - - -On a Mac, the command will look something like this: - -{% filename %}command-line{% endfilename %} -``` -$ cd ~/Desktop -``` - - - - -On Linux, it will be like this: - -{% filename %}command-line{% endfilename %} -``` -$ cd ~/Desktop -``` - -(Remember that the word "Desktop" might be translated to your local language.) - - - - - -On Windows Command Prompt, it will be like this: - -{% filename %}command-line{% endfilename %} -``` -> cd %HomePath%\Desktop -``` - - - - - -And on Windows Powershell, it will be like this: - -{% filename %}command-line{% endfilename %} -``` -> cd $Home\Desktop -``` - - - -If you get stuck, ask for help. That's exactly what the coaches are here for! - -Now use Python to execute the code in the file like this: - -{% filename %}command-line{% endfilename %} -``` -$ python3 python_intro.py -Hello, Django girls! -``` - -Note: on Windows 'python3' is not recognized as a command. Instead, use 'python' to execute the file: - -{% filename %}command-line{% endfilename %} -```python -> python python_intro.py -``` - -Alright! You just ran your first Python program that was saved to a file. Feel awesome? - -You can now move on to an essential tool in programming: - -## If … elif … else - -Lots of things in code should be executed only when given conditions are met. That's why Python has something called __if statements__. - -Replace the code in your **python_intro.py** file with this: - -{% filename %}python_intro.py{% endfilename %} -```python -if 3 > 2: -``` - -If we were to save and run this, we'd see an error like this: - -{% filename %}{{ warning_icon }} command-line{% endfilename %} -``` -$ python3 python_intro.py -File "python_intro.py", line 2 - ^ -SyntaxError: unexpected EOF while parsing -``` - -Python expects us to give further instructions to it which are executed if the condition `3 > 2` turns out to be true (or `True` for that matter). Let’s try to make Python print “It works!”. Change your code in your **python_intro.py** file to this: - -{% filename %}python_intro.py{% endfilename %} -```python -if 3 > 2: - print('It works!') -``` - -Notice how we've indented the next line of code by 4 spaces? We need to do this so Python knows what code to run if the result is true. You can do one space, but nearly all Python programmers do 4 to make things look neat. A single Tab will also count as 4 spaces as long as your text editor is set to do so. When you made your choice, don't change it! If you already indented with 4 spaces, make any future indentation with 4 spaces, too - otherwise you may run into problems. - -Save it and give it another run: - -{% filename %}command-line{% endfilename %} -```python -$ python3 python_intro.py -It works! -``` - -Note: Remember that on Windows, 'python3' is not recognized as a command. From now on, replace 'python3' with 'python' to execute the file. - -### What if a condition isn't True? - -In previous examples, code was executed only when the conditions were True. But Python also has `elif` and `else` statements: - -{% filename %}python_intro.py{% endfilename %} -```python -if 5 > 2: - print('5 is indeed greater than 2') -else: - print('5 is not greater than 2') -``` - -When this is run it will print out: - -{% filename %}command-line{% endfilename %} -``` -$ python3 python_intro.py -5 is indeed greater than 2 -``` - -If 2 were a greater number than 5, then the second command would be executed. Let's see how `elif` works: - -{% filename %}python_intro.py{% endfilename %} -```python -name = 'Sonja' -if name == 'Ola': - print('Hey Ola!') -elif name == 'Sonja': - print('Hey Sonja!') -else: - print('Hey anonymous!') -``` - -and executed: - -{% filename %}command-line{% endfilename %} -``` -$ python3 python_intro.py -Hey Sonja! -``` - -See what happened there? `elif` lets you add extra conditions that run if the previous conditions fail. - -You can add as many `elif` statements as you like after your initial `if` statement. For example: - -{% filename %}python_intro.py{% endfilename %} -```python -volume = 57 -if volume < 20: - print("It's kinda quiet.") -elif 20 <= volume < 40: - print("It's nice for background music") -elif 40 <= volume < 60: - print("Perfect, I can hear all the details") -elif 60 <= volume < 80: - print("Nice for parties") -elif 80 <= volume < 100: - print("A bit loud!") -else: - print("My ears are hurting! :(") -``` - -Python runs through each test in sequence and prints: - -{% filename %}command-line{% endfilename %} -``` -$ python3 python_intro.py -Perfect, I can hear all the details -``` - -## Comments - -Comments are lines beginning with `#`. You can write whatever you want after the `#` and Python will ignore it. Comments can make your code easier for other people to understand. - -Let's see how that looks: - -{% filename %}python_intro.py{% endfilename %} -```python -# Change the volume if it's too loud or too quiet -if volume < 20 or volume > 80: - volume = 50 - print("That's better!") -``` - -You don't need to write a comment for every line of code, but they are useful for explaining why your code is doing something, or providing a summary when it's doing something complex. - - -### Summary - -In the last few exercises you learned about: - -- __comparing things__ – in Python you can compare things by using `>`, `>=`, `==`, `<=`, `<` and the `and`, `or` operators -- __Boolean__ – a type of object that can only have one of two values: `True` or `False` -- __Saving files__ – storing code in files so you can execute larger programs. -- __if … elif … else__ – statements that allow you to execute code only when certain conditions are met. -- __comments__ - lines that Python won't run which let you document your code - -Time for the last part of this chapter! - -## Your own functions! - -> For readers at home: this part is covered in the [Python Basics: Functions](https://www.youtube.com/watch?v=5owr-6suOl0) video. - -Remember functions like `len()` that you can execute in Python? Well, good news – you will learn how to write your own functions now! - -A function is a sequence of instructions that Python should execute. Each function in Python starts with the keyword `def`, is given a name, and can have some parameters. Let's give it a go. Replace the code in **python_intro.py** with the following: - -{% filename %}python_intro.py{% endfilename %} -```python -def hi(): - print('Hi there!') - print('How are you?') - -hi() -``` - -Okay, our first function is ready! - -You may wonder why we've written the name of the function at the bottom of the file. When we write `def hi():` and the indented lines following, this is us writing instructions for what the `hi()` function should do. Python will read and remember these instructions, but won't run the function yet. To tell Python we want to run the function, we have to call the function with `hi()`. Python reads the file and executes it from top to bottom, so we have to define the function in the file before we call it. - -Let's run this now and see what happens: - -{% filename %}command-line{% endfilename %} -``` -$ python3 python_intro.py -Hi there! -How are you? -``` - -Note: if it didn't work, don't panic! The output will help you to figure why: -- If you get a `NameError`, that probably means you typed something wrong, so you should check that you used the same name when creating the function with `def hi():` and when calling it with `hi()`. -- If you get an `IndentationError`, check that both of the `print` lines have the same whitespace at the start of a line: python wants all the code inside the function to be neatly aligned. -- If there's no output at all, check that the last `hi()` *isn't* indented - if it is, that line will become part of the function too, and it will never get run. - -Let's build our first function with parameters. We will change the previous example – a function that says 'hi' to the person running it – with a name: - -{% filename %}python_intro.py{% endfilename %} -```python -def hi(name): -``` - -As you can see, we now gave our function a parameter that we called `name`: - -{% filename %}python_intro.py{% endfilename %} -```python -def hi(name): - if name == 'Ola': - print('Hi Ola!') - elif name == 'Sonja': - print('Hi Sonja!') - else: - print('Hi anonymous!') - -hi() -``` - -Remember: The `print` function is indented four spaces within the `if` statement. This is because the function runs when the condition is met. Let's see how it works now: - -{% filename %}{{ warning_icon }} command-line{% endfilename %} -``` -$ python3 python_intro.py -Traceback (most recent call last): -File "python_intro.py", line 10, in - hi() -TypeError: hi() missing 1 required positional argument: 'name' -``` - -Oops, an error. Luckily, Python gives us a pretty useful error message. -It tells us that the function `hi()` (the one we defined) has one required argument (called `name`) and that we forgot to pass it when calling the function. -Let's fix it at the bottom of the file: - -{% filename %}python_intro.py{% endfilename %} -```python -hi("Ola") -``` - -And run it again: - -{% filename %}command-line{% endfilename %} -``` -$ python3 python_intro.py -Hi Ola! -``` - -And if we change the name? - -{% filename %}python_intro.py{% endfilename %} -```python -hi("Sonja") -``` - -And run it: - -{% filename %}command-line{% endfilename %} -``` -$ python3 python_intro.py -Hi Sonja! -``` - -Now, what do you think will happen if you write another name in there? (Not Ola or Sonja.) Give it a try and see if you're right. It should print out this: - -{% filename %}command-line{% endfilename %} -``` -Hi anonymous! -``` - -This is awesome, right? This way you don't have to repeat yourself every time you want to change the name of the person the function is supposed to greet. And that's exactly why we need functions – you never want to repeat your code! - -Let's do something smarter – there are more names than two, and writing a condition for each would be hard, right? Replace the content of your file with the following: - -{% filename %}python_intro.py{% endfilename %} -```python -def hi(name): - print('Hi ' + name + '!') - -hi("Rachel") -``` - -Let's call the code now: - -{% filename %}command-line{% endfilename %} -``` -$ python3 python_intro.py -Hi Rachel! -``` - -Congratulations! You just learned how to write functions! :) - -## Loops - -> For readers at home: this part is covered in the [Python Basics: For Loop](https://www.youtube.com/watch?v=aEA6Rc86HF0) video. - -This is the last part already. That was quick, right? :) - -Programmers don't like to repeat themselves. Programming is all about automating things, so we don't want to greet every person by their name manually, right? That's where loops come in handy. - -Still remember lists? Let's do a list of girls: - -{% filename %}python_intro.py{% endfilename %} -```python -girls = ['Rachel', 'Monica', 'Phoebe', 'Ola', 'You'] -``` - -We want to greet all of them by their name. We have the `hi` function to do that, so let's use it in a loop: - -{% filename %}python_intro.py{% endfilename %} -```python -for name in girls: -``` - -The `for` statement behaves similarly to the `if` statement; code below both of these need to be indented four spaces. - -Here is the full code that will be in the file: - -{% filename %}python_intro.py{% endfilename %} -```python -def hi(name): - print('Hi ' + name + '!') - -girls = ['Rachel', 'Monica', 'Phoebe', 'Ola', 'You'] -for name in girls: - hi(name) - print('Next girl') -``` - -And when we run it: - -{% filename %}command-line{% endfilename %} -``` -$ python3 python_intro.py -Hi Rachel! -Next girl -Hi Monica! -Next girl -Hi Phoebe! -Next girl -Hi Ola! -Next girl -Hi You! -Next girl -``` - -As you can see, everything you put inside a `for` statement with an indent will be repeated for every element of the list `girls`. - -You can also use `for` on numbers using the `range` function: - -{% filename %}python_intro.py{% endfilename %} -```python -for i in range(1, 6): - print(i) -``` - -Which would print: - -{% filename %}command-line{% endfilename %} -``` -1 -2 -3 -4 -5 -``` - -`range` is a function that creates a list of numbers following one after the other (these numbers are provided by you as parameters). - -Note that the second of these two numbers is not included in the list that is output by Python (meaning `range(1, 6)` counts from 1 to 5, but does not include the number 6). That is because "range" is half-open, and by that we mean it includes the first value, but not the last. - -## Summary - -That's it. __You totally rock!__ This was a tricky chapter, so you should feel proud of yourself. We're definitely proud of you for making it this far! - -For official and full python tutorial visit https://docs.python.org/3/tutorial/. This will give you a more thorough and complete study of the language. Cheers! :) - -You might want to briefly do something else – stretch, walk around for a bit, rest your eyes – before going on to the next chapter. :) - - -![Cupcake](images/cupcake.png) +To continue, pick your platform/operating system: +* [RunCode Cloud](../runcode/python_introduction/README.md) +* [ChromeBook/Linux](../linux/python_introduction/README.md) +* [Mac OSX](../macosx/python_introduction/README.md) +* [Windows](../windows/python_introduction/README.md) \ No newline at end of file diff --git a/en/python_introduction/instructions.md b/en/python_introduction/instructions.md new file mode 100644 index 00000000000..f15ea78e112 --- /dev/null +++ b/en/python_introduction/instructions.md @@ -0,0 +1,625 @@ +## Your first Python command! + +After running the Python command, the prompt changed to `>>>`. For us this means that for now we may only use commands in the +Python language. You don't have to type in `>>>` – Python will do that for you. + +If you want to exit the Python console at any point, type `exit()` or use the shortcut `Ctrl + Z` for Windows and `Ctrl + D` for +Mac/Linux. Then you won't see `>>>` any longer. + +For now, we don't want to exit the Python console. We want to learn more about it. Let's start by typing some math, like `2 + 3` +and hitting `enter`. + +{% filename %}command-line{% endfilename %} +```python +>>> 2 + 3 +5 +``` + +Nice! See how the answer popped out? Python knows math! You could try other commands like: + +- `4 * 5` +- `5 - 1` +- `40 / 2` + +To perform exponential calculation, say 2 to the power 3, we type: +{% filename %}command-line{% endfilename %} +```python +>>> 2 ** 3 +8 +``` + +Have fun with this for a little while and then get back here. :) + +As you can see, Python is a great calculator. If you're wondering what else you can do… + +## Strings + +How about your name? Type your first name in quotes like this: + +{% filename %}command-line{% endfilename %} +```python +>>> "Ola" +'Ola' +``` + +You've now created your first string! It's a sequence of characters that can be processed by a computer. The string must always +begin and end with the same character. This may be single (`'`) or double (`"`) quotes (there is no difference!)The quotes tell +Python that what's inside of them is a string. + +Strings can be strung together. Try this: + +{% filename %}command-line{% endfilename %} +```python +>>> "Hi there " + "Ola" +'Hi there Ola' +``` + +You can also multiply strings with a number: + +{% filename %}command-line{% endfilename %} +```python +>>> "Ola" * 3 +'OlaOlaOla' +``` + +If you need to put an apostrophe inside your string, you have two ways to do it. + +Using double quotes: + +{% filename %}command-line{% endfilename %} +```python +>>> "Runnin' down the hill" +"Runnin' down the hill" +``` + +or escaping the apostrophe with a backslash (`\`): + +{% filename %}command-line{% endfilename %} +```python +>>> 'Runnin\' down the hill' +"Runnin' down the hill" +``` + +Nice, huh? To see your name in uppercase letters, type: + +{% filename %}command-line{% endfilename %} +```python +>>> "Ola".upper() +'OLA' +``` + +You just used the `upper` __method__ on your string! A method (like `upper()`) is a sequence of instructions that Python has to perform +on a given object (`"Ola"`) once you call it. + +If you want to know the number of letters contained in your name, there is a __function__ for that too! + +{% filename %}command-line{% endfilename %} +```python +>>> len("Ola") +3 +``` + +Wonder why sometimes you call functions with a `.` at the end of a string (like `"Ola".upper()`) and sometimes you first call a +function and place the string in parentheses? Well, in some cases, functions belong to objects, like `upper()`, which can only +be performed on strings. In this case, we call the function a __method__. Other times, functions don't belong to anything +specific and can be used on different types of objects, just like `len()`. That's why we're giving `"Ola"` as a parameter to the +`len` function. + +### Summary + +OK, enough of strings. So far you've learned about: + +- __the prompt__ – typing commands (code) into the Python prompt results in answers in Python +- __numbers and strings__ – in Python numbers are used for math and strings for text objects +- __operators__ – like `+` and `*`, combine values to produce a new one +- __functions__ – like `upper()` and `len()`, perform actions on objects. + +These are the basics of every programming language you learn. Ready for something harder? We bet you are! + +## Errors + +Let's try something new. Can we get the length of a number the same way we could find out the length of our name? Type in +`len(304023)` and hit `enter`: + +{% filename %}{{ warning_icon }} command-line{% endfilename %} +```python +>>> len(304023) +Traceback (most recent call last): + File "", line 1, in +TypeError: object of type 'int' has no len() +``` + +We got our first error! The {{ warning_icon }} icon is our way of giving you a heads up that the code you are about to run +won't work as expected. Making mistakes (even intentional ones) are an important part of learning! + +It says that objects of type "int" (integers, whole numbers) have no length. So what can we do now? Maybe we can write our number +as a string? Strings have a length, right? + +{% filename %}command-line{% endfilename %} +```python +>>> len(str(304023)) +6 +``` + +It worked! We used the `str` function inside of the `len` function. `str()` converts everything to strings. + +- The `str` function converts things into __strings__ +- The `int` function converts things into __integers__ + +> Important: we can convert numbers into text, but we can't necessarily convert +text into numbers – what would `int('hello')` be anyway? + +## Variables + +An important concept in programming is variables. A variable is nothing more than a name for something so you can use it later. +Programmers use these variables to store data, make their code more readable and so they don't have to keep remembering what things are. + +Let's say we want to create a new variable called `name`: + +{% filename %}command-line{% endfilename %} +```python +>>> name = "Ola" +``` + +We type name equals Ola. + +As you've noticed, your program didn't return anything like it did before. So how do we know that the variable actually exists? +Enter `name` and hit `enter`: + +{% filename %}command-line{% endfilename %} +```python +>>> name +'Ola' +``` + +Yippee! Your first variable! :) You can always change what it refers to: + +{% filename %}command-line{% endfilename %} +```python +>>> name = "Sonja" +>>> name +'Sonja' +``` + +You can use it in functions too: + +{% filename %}command-line{% endfilename %} +```python +>>> len(name) +5 +``` + +Awesome, right? Now, variables can be anything – numbers too! Try this: + +{% filename %}command-line{% endfilename %} +```python +>>> a = 4 +>>> b = 6 +>>> a * b +24 +``` + +But what if we used the wrong name? Can you guess what would happen? Let's try! + +{% filename %}{{ warning_icon }} command-line{% endfilename %} +```python +>>> city = "Tokyo" +>>> ctiy +Traceback (most recent call last): + File "", line 1, in +NameError: name 'ctiy' is not defined +``` + +An error! As you can see, Python has different types of errors and this one is called a **NameError**. Python will give you this +error if you try to use a variable that hasn't been defined yet. If you encounter this error later, check your code to see if +you've mistyped any names. + +Play with this for a while and see what you can do! + + +## The print function + +Try this: + +{% filename %}command-line{% endfilename %} +```python +>>> name = 'Maria' +>>> name +'Maria' +>>> print(name) +Maria +``` + +When you just type `name`, the Python interpreter responds with the string *representation* of the variable 'name', which is the +letters M-a-r-i-a, surrounded by single quotes, ''. When you say `print(name)`, Python will "print" the contents of the variable +to the screen, without the quotes, which is neater. + +As we'll see later, `print()` is also useful when we want to print things from inside functions, or when we want to print things +on multiple lines. + + +## Lists + +Beside strings and integers, Python has all sorts of different types of objects. Now we're going to introduce one called +__list__. Lists are exactly what you think they are: objects which are lists of other objects. :) + +Go ahead and create a list: + +{% filename %}command-line{% endfilename %} +```python +>>> [] +[] +``` + +Yes, this list is empty. Not very useful, right? Let's create a list of lottery numbers. We don't want to repeat ourselves all +the time, so we will put it in a variable, too: + +{% filename %}command-line{% endfilename %} +```python +>>> lottery = [3, 42, 12, 19, 30, 59] +``` + +All right, we have a list! What can we do with it? Let's see how many lottery numbers there are in a list. Do you have any idea +which function you should use for that? You know this already! + +{% filename %}command-line{% endfilename %} +```python +>>> len(lottery) +6 +``` + +Yes! `len()` can give you a number of objects in a list. Handy, right? Maybe we will sort it now: + +{% filename %}command-line{% endfilename %} +```python +>>> lottery.sort() +``` + +This doesn't return anything, it just changed the order in which the numbers appear in the list. Let's print it out again and +see what happened: + +{% filename %}command-line{% endfilename %} +```python +>>> print(lottery) +[3, 12, 19, 30, 42, 59] +``` + +As you can see, the numbers in your list are now sorted from the lowest to highest value. Congrats! + +Maybe we want to reverse that order? Let's do that! + +{% filename %}command-line{% endfilename %} +```python +>>> lottery.reverse() +>>> print(lottery) +[59, 42, 30, 19, 12, 3] +``` + +If you want to add something to your list, you can do this by typing this command: + +{% filename %}command-line{% endfilename %} +```python +>>> lottery.append(199) +>>> print(lottery) +[59, 42, 30, 19, 12, 3, 199] +``` + +If you want to show only the first number, you can do this by using __indexes__. An index is the number that says where in a list +an item occurs. Programmers prefer to start counting at 0, so the first object in your list is at index 0, the next one is +at 1, and so on. Try this: + +{% filename %}command-line{% endfilename %} +```python +>>> print(lottery[0]) +59 +>>> print(lottery[1]) +42 +``` + +As you can see, you can access different objects in your list by using the list's name and the object's index inside of square brackets. + +To delete something from your list you will need to use __indexes__ as we learned above and the `pop()` method. Let's try an +example and reinforce what we learned previously; we will be deleting the first number of our list. + +{% filename %}command-line{% endfilename %} +```python +>>> print(lottery) +[59, 42, 30, 19, 12, 3, 199] +>>> print(lottery[0]) +59 +>>> lottery.pop(0) +59 +>>> print(lottery) +[42, 30, 19, 12, 3, 199] +``` + +That worked like a charm! + +For extra fun, try some other indexes: 6, 7, 1000, -1, -6 or -1000. See if you can predict the result before trying the command. +Do the results make sense? + +You can find a list of all available list methods in this chapter of the Python documentation: +https://docs.python.org/3/tutorial/datastructures.html + +## Dictionaries + +> For readers at home: this part is covered in the [Python Basics: Dictionaries](https://www.youtube.com/watch?v=ZX1CVvZLE6c) +video. + +A dictionary is similar to a list, but you access values by looking up a key instead of a numeric index. A key can be any string or +number. The syntax to define an empty dictionary is: + +{% filename %}command-line{% endfilename %} +```python +>>> {} +{} +``` + +This shows that you just created an empty dictionary. Hurray! + +Now, try writing the following command (try substituting your own information, too): + +{% filename %}command-line{% endfilename %} +```python +>>> participant = {'name': 'Ola', 'country': 'Poland', 'favorite_numbers': [7, 42, 92]} +``` + +With this command, you just created a variable named `participant` with three key–value pairs: + +- The key `name` points to the value `'Ola'` (a `string` object), +- `country` points to `'Poland'` (another `string`), +- and `favorite_numbers` points to `[7, 42, 92]` (a `list` with three numbers in it). + +You can check the content of individual keys with this syntax: + +{% filename %}command-line{% endfilename %} +```python +>>> print(participant['name']) +Ola +``` + +See, it's similar to a list. But you don't need to remember the index – just the name. + +What happens if we ask Python the value of a key that doesn't exist? Can you guess? Let's try it and see! + +{% filename %}{{ warning_icon }} command-line{% endfilename %} +```python +>>> participant['age'] +Traceback (most recent call last): + File "", line 1, in +KeyError: 'age' +``` + +Look, another error! This one is a **KeyError**. Python is helpful and tells you that the key `'age'` doesn't exist in this +dictionary. + +When should you use a dictionary or a list? Well, that's a good point to ponder. Think about the answer before looking at it in +the next line. + +- Do you just need an ordered sequence of items? + Go for a list. +- Do you need to associate values with keys, so you can look them up + efficiently (by key) later on? Use a dictionary. + +Like lists, using the `len()` function on the dictionaries returns the number of key–value pairs in the dictionary. Go ahead and +type in this command: + +{% filename %}command-line{% endfilename %} +```python +>>> len(participant) +3 +``` + +Dictionaries, like lists, are *mutable*, meaning that they can be changed after they are created. You can add new key–value +pairs to a dictionary after it is created, like this: + +{% filename %}command-line{% endfilename %} +```python +>>> participant['favorite_language'] = 'Python' +``` + +I hope it makes sense up to now. :) Ready for some more fun with dictionaries? Read on for some amazing things. + +You can use the `pop()` method to delete an item in the dictionary. Say, if you want to delete the entry corresponding to the +key `'favorite_numbers'`, type in the following command: + +{% filename %}command-line{% endfilename %} +```python +>>> participant.pop('favorite_numbers') +[7, 42, 92] +>>> participant +{'country': 'Poland', 'favorite_language': 'Python', 'name': 'Ola'} +``` + +As you can see from the output, the key–value pair corresponding to the 'favorite_numbers' key has been deleted. + +As well as this, you can also change a value associated with an already-created key in the dictionary. Type this: + +{% filename %}command-line{% endfilename %} +```python +>>> participant['country'] = 'Germany' +>>> participant +{'country': 'Germany', 'favorite_language': 'Python', 'name': 'Ola'} +``` + +As you can see, the value of the key `'country'` has been altered from `'Poland'` to `'Germany'`. :) Exciting? Hurrah! +You just learned another amazing thing. + +### Summary + +Awesome! You know a lot about programming now. In this last part you learned about: + +- __errors__ – you now know how to read and understand errors that show up if + Python doesn't understand a command you've given it +- __variables__ – names for objects that allow you to code more easily and to + make your code more readable +- __lists__ – lists of objects stored in a particular order +- __dictionaries__ – objects stored as key–value pairs + +Excited for the next part? :) + +## Compare things + +> For readers at home: this part is covered in the [Python Basics: Comparisons](https://www.youtube.com/watch?v=7bzxqIKYgf4) +video. + +A big part of programming involves comparing things. What's the easiest thing to compare? Numbers! Let's see how that works: + +{% filename %}command-line{% endfilename %} +```python +>>> 5 > 2 +True +>>> 3 < 1 +False +>>> 5 > 2 * 2 +True +>>> 1 == 1 +True +>>> 5 != 2 +True +>>> len([1, 2, 3]) > len([4, 5]) +True +``` + +We gave Python some numbers to compare. As you can see, not only can Python compare numbers, but it can also compare values of +mathematical expressions like `2 * 2` and function results like the`2` returned by `len([4, 5])`. Nice, huh? + +Do you wonder why we put two equal signs `==` next to each other to compare if numbers are equal? We use a single `=` for +assigning values to variables. You always, __always__ need to put two of them – `==` – if you want to check if things are equal +to each other. We can also state that things are unequal to each other. For that, we use the symbol `!=`, as shown in the +example above. + +Give Python two more tasks: + +{% filename %}command-line{% endfilename %} +```python +>>> 6 >= 12 / 2 +True +>>> 3 <= 2 +False +``` + +We've seen `>` and `<`, but what do `>=` and `<=` mean? Read them like this: + +- x `>` y means: x is greater than y +- x `<` y means: x is less than y +- x `<=` y means: x is less than or equal to y +- x `>=` y means: x is greater than or equal to y + +Awesome! Wanna do one more? Try this: + +{% filename %}command-line{% endfilename %} +```python +>>> 6 > 2 and 2 < 3 +True +>>> 3 > 2 and 2 < 1 +False +>>> 3 > 2 or 2 < 1 +True +``` + +You can give Python as many numbers to compare as you want, and it will give you an answer! Pretty smart, right? + +- __and__ – if you use the `and` operator, both comparisons have to be True in order for the whole command to be True +- __or__ – if you use the `or` operator, only one of the comparisons has to be True in order for the whole command to be True + +Have you heard of the expression "comparing apples to oranges"? Let's try the Python equivalent: + +{% filename %}{{ warning_icon }} command-line{% endfilename %} +```python +>>> 1 > 'django' +Traceback (most recent call last): + File "", line 1, in +TypeError: '>' not supported between instances of 'int' and 'str' +``` + +Here you see that just like in the expression, Python is not able to compare a number (`int`) and a string (`str`). +Instead, it shows a **TypeError** and tells us the two types can't be compared together. + +## Boolean + +Incidentally, you just learned about a new type of object in Python. It's called __Boolean__. + +There are only two Boolean objects: +- True +- False + +But for Python to understand this, you need to always write it as 'True'(first letter uppercase, with the rest of the letters +lowercased). __true, TRUE, and tRUE won't work – only True is correct.__ (The same applies to 'False' as well.) + +Booleans can be variables, too! See here: + +{% filename %}command-line{% endfilename %} +```python +>>> a = True +>>> a +True +``` + +You can also do it this way: + +{% filename %}command-line{% endfilename %} +```python +>>> a = 2 > 5 +>>> a +False +``` + +Practice and have fun with Booleans by trying to run the following commands: + +- `True and True` +- `False and True` +- `True or 1 == 1` +- `1 != 2` + +Congrats! Booleans are one of the coolest features in programming, and you just learned how to use them! + +# Save it! + +> For readers at home: this part is covered in the[Python Basics: Saving files and "If" statement](https://www.youtube.com/watch?v=dOAg6QVAxyk) +> video. + + +So far we've been writing all our python code in the interpreter, which limits us to entering one line of code at a time. Normal +programs are saved in files and executed by our programming language__interpreter__ or __compiler__. So far we've been running +our programs one line at a time in the Python __interpreter__. We're going to need more than one line of code for the next few +tasks, so we'll quickly need to: + +- Exit the Python interpreter +- Open up our code editor of choice +- Save some code into a new python file +- Run it! + +To exit from the Python interpreter that we've been using, type the `exit()` function + +{% filename %}command-line{% endfilename %} +```python +>>> exit() +$ +``` + +This will put you back into the command prompt. + +Earlier, we picked out a code editor from the [code editor](../code_editor/README.md) section. We'll need to open the editor now +and write some code into a new file (or if you're using a Chromebook, create a new file in the cloud IDE and open the file, +which will be in the included code editor): + +{% filename %}editor{% endfilename %} +```python +print('Hello, Django girls!') +``` + +Obviously, you're a pretty seasoned Python developer now, so feel free to write some code that you've learned today. + +Now we need to save the file and give it a descriptive name. Let's call the file **python_intro.py** and save it to your +desktop. We can name the file anything we want, but the important part here is to make sure the file ends in __.py__. The +__.py__ extension tells our operating system that this is a **Python executable file** and Python can run it. + +> **Note** You should notice one of the coolest thing about code editors: colors! In the Python console, everything was the same +color; now you should see that the `print` function is a different color from the string. This is called "syntax highlighting", +and it's a really useful feature when coding. The color of things will give you hints, such as unclosed strings or a typo in +a keyword name (like the `def` in a function, which we'll see below). This is one of the reasons we use a code editor. :) + + +With the file saved, it's time to run it! Using the skills you've learned in the command line section, use the terminal to +**change directories** to the desktop. diff --git a/en/python_introduction/instructions_part_two.md b/en/python_introduction/instructions_part_two.md new file mode 100644 index 00000000000..7d19839bf74 --- /dev/null +++ b/en/python_introduction/instructions_part_two.md @@ -0,0 +1,393 @@ +Alright! You just ran your first Python program that was saved to a file. Feel awesome? + +You can now move on to an essential tool in programming: + +## If … elif … else + +Lots of things in code should be executed only when given conditions are met. That's why Python has something called __if statements__. + +Replace the code in your **python_intro.py** file with this: + +{% filename %}python_intro.py{% endfilename %} +```python +if 3 > 2: +``` + +If we were to save and run this, we'd see an error like this: + +{% filename %}{{ warning_icon }} command-line{% endfilename %} +``` +$ python3 python_intro.py +File "python_intro.py", line 2 + ^ +SyntaxError: unexpected EOF while parsing +``` + +Python expects us to give further instructions to it which are executed if the condition `3 > 2` turns out to be true (or `True` for +that matter). Let’s try to make Python print “It works!”. Change your code in your **python_intro.py** file to this: + +{% filename %}python_intro.py{% endfilename %} +```python +if 3 > 2: + print('It works!') +``` + +Notice how we've indented the next line of code by 4 spaces? We need to do this so Python knows what code to run if the result +is true. You can do one space, but nearly all Python programmers do 4 to make things look neat. A single Tab will also count as 4 +spaces as long as your text editor is set to do so. When you made your choice, don't change it!If you already indented with 4 spaces, +make any future indentation with 4 spaces, too - otherwise you may run into problems. + +Save it and give it another run: + +{% filename %}command-line{% endfilename %} +```python +$ python3 python_intro.py +It works! +``` + +Note: Remember that on Windows, 'python3' is not recognized as a command. From now on, replace 'python3' with 'python' to execute +the file. + +### What if a condition isn't True? + +In previous examples, code was executed only when the conditions were True. But Python also has `elif` and `else` statements: + +{% filename %}python_intro.py{% endfilename %} +```python +if 5 > 2: + print('5 is indeed greater than 2') +else: + print('5 is not greater than 2') +``` + +When this is run it will print out: + +{% filename %}command-line{% endfilename %} +``` +$ python3 python_intro.py +5 is indeed greater than 2 +``` + +If 2 were a greater number than 5, then the second command would be executed. Let's see how `elif` works: + +{% filename %}python_intro.py{% endfilename %} +```python +name = 'Sonja' +if name == 'Ola': + print('Hey Ola!') +elif name == 'Sonja': + print('Hey Sonja!') +else: + print('Hey anonymous!') +``` + +and executed: + +{% filename %}command-line{% endfilename %} +``` +$ python3 python_intro.py +Hey Sonja! +``` + +See what happened there? `elif` lets you add extra conditions that run if the previous conditions fail. + +You can add as many `elif` statements as you like after your initial `if` statement. For example: + +{% filename %}python_intro.py{% endfilename %} +```python +volume = 57 +if volume < 20: + print("It's kinda quiet.") +elif 20 <= volume < 40: + print("It's nice for background music") +elif 40 <= volume < 60: + print("Perfect, I can hear all the details") +elif 60 <= volume < 80: + print("Nice for parties") +elif 80 <= volume < 100: + print("A bit loud!") +else: + print("My ears are hurting! :(") +``` + +Python runs through each test in sequence and prints: + +{% filename %}command-line{% endfilename %} +``` +$ python3 python_intro.py +Perfect, I can hear all the details +``` + +## Comments + +Comments are lines beginning with `#`. You can write whatever you want after the `#` and Python will ignore it. Comments can +make your code easier for other people to understand. + +Let's see how that looks: + +{% filename %}python_intro.py{% endfilename %} +```python +# Change the volume if it's too loud or too quiet +if volume < 20 or volume > 80: + volume = 50 + print("That's better!") +``` + +You don't need to write a comment for every line of code, but they are useful for explaining why your code is doing something, +or providing a summary when it's doing something complex. + + +### Summary + +In the last few exercises you learned about: + +- __comparing things__ – in Python you can compare things by using `>`, `>=`, + `==`, `<=`, `<` and the `and`, `or` operators +- __Boolean__ – a type of object that can only have one of two values: `True` or `False` +- __Saving files__ – storing code in files so you can execute larger programs. +- __if … elif … else__ – statements that allow you to execute code only when + certain conditions are met. +- __comments__ - lines that Python won't run which let you document your code + +Time for the last part of this chapter! + +## Your own functions! + +> For readers at home: this part is covered in the +[Python Basics: Functions](https://www.youtube.com/watch?v=5owr-6suOl0) video. + +Remember functions like `len()` that you can execute in Python? Well, good news – you will learn how to write your own functions now! + +A function is a sequence of instructions that Python should execute. Each function in Python starts with the keyword `def`, is +given a name, and can have some parameters. Let's give it a go. Replace the code in **python_intro.py** with the following: + +{% filename %}python_intro.py{% endfilename %} +```python +def hi(): + print('Hi there!') + print('How are you?') + +hi() +``` + +Okay, our first function is ready! + +You may wonder why we've written the name of the function at the bottom of the file. When we write `def hi():` and the indented +lines following, this is us writing instructions for what the `hi()` function should do. Python will read and remember these +instructions, but won't run the function yet. To tell Python we want to run the function, we have to call the function with +`hi()`. Python reads the file and executes it from top to bottom, so we have to define the function in the file before we call it. + +Let's run this now and see what happens: + +{% filename %}command-line{% endfilename %} +``` +$ python3 python_intro.py +Hi there! +How are you? +``` + +Note: if it didn't work, don't panic! The output will help you to figure why: +- If you get a `NameError`, that probably means you typed something wrong, so you should check that you used the same name when + creating the function with `def hi():` and when calling it with `hi()`. +- If you get an `IndentationError`, check that both of the `print` lines have the same whitespace at the start of a line: python + wants all the code inside the function to be neatly aligned. +- If there's no output at all, check that the last `hi()` *isn't* indented - if it is, that line will become part of the + function too, and it will never get run. + +Let's build our first function with parameters. We will change the previous example – a function that says 'hi' to the person +running it – with a name: + +{% filename %}python_intro.py{% endfilename %} +```python +def hi(name): +``` + +As you can see, we now gave our function a parameter that we called `name`: + +{% filename %}python_intro.py{% endfilename %} +```python +def hi(name): + if name == 'Ola': + print('Hi Ola!') + elif name == 'Sonja': + print('Hi Sonja!') + else: + print('Hi anonymous!') + +hi() +``` + +Remember: The `print` function is indented four spaces within the `if` statement. This is because the function runs when the +condition is met. Let's see how it works now: + +{% filename %}{{ warning_icon }} command-line{% endfilename %} +``` +$ python3 python_intro.py +Traceback (most recent call last): +File "python_intro.py", line 10, in + hi() +TypeError: hi() missing 1 required positional argument: 'name' +``` + +Oops, an error. Luckily, Python gives us a pretty useful error message. +It tells us that the function `hi()` (the one we defined) has one required argument (called `name`) and that we forgot to pass +it when calling the function. +Let's fix it at the bottom of the file: + +{% filename %}python_intro.py{% endfilename %} +```python +hi("Ola") +``` + +And run it again: + +{% filename %}command-line{% endfilename %} +``` +$ python3 python_intro.py +Hi Ola! +``` + +And if we change the name? + +{% filename %}python_intro.py{% endfilename %} +```python +hi("Sonja") +``` + +And run it: + +{% filename %}command-line{% endfilename %} +``` +$ python3 python_intro.py +Hi Sonja! +``` + +Now, what do you think will happen if you write another name in there? (Not Ola or Sonja.) Give it a try and see if you're +right. It should print out this: + +{% filename %}command-line{% endfilename %} +``` +Hi anonymous! +``` + +This is awesome, right? This way you don't have to repeat yourself every time you want to change the name of the person the +function is supposed to greet. And that's exactly why we need functions – you never want to repeat your code! + +Let's do something smarter – there are more names than two, and writing a condition for each would be hard, right? Replace the +content of your file with the following: + +{% filename %}python_intro.py{% endfilename %} +```python +def hi(name): + print('Hi ' + name + '!') + +hi("Rachel") +``` + +Let's call the code now: + +{% filename %}command-line{% endfilename %} +``` +$ python3 python_intro.py +Hi Rachel! +``` + +Congratulations! You just learned how to write functions! :) + +## Loops + +> For readers at home: this part is covered in the +[Python Basics: For Loop](https://www.youtube.com/watch?v=aEA6Rc86HF0) video. + +This is the last part already. That was quick, right? :) + +Programmers don't like to repeat themselves. Programming is all about automating things, so we don't want to greet every person +by their name manually, right? That's where loops come in handy. + +Still remember lists? Let's do a list of girls: + +{% filename %}python_intro.py{% endfilename %} +```python +girls = ['Rachel', 'Monica', 'Phoebe', 'Ola', 'You'] +``` + +We want to greet all of them by their name. We have the `hi` function to do that, so let's use it in a loop: + +{% filename %}python_intro.py{% endfilename %} +```python +for name in girls: +``` + +The `for` statement behaves similarly to the `if` statement; code below both of these need to be indented four spaces. + +Here is the full code that will be in the file: + +{% filename %}python_intro.py{% endfilename %} +```python +def hi(name): + print('Hi ' + name + '!') + +girls = ['Rachel', 'Monica', 'Phoebe', 'Ola', 'You'] +for name in girls: + hi(name) + print('Next girl') +``` + +And when we run it: + +{% filename %}command-line{% endfilename %} +``` +$ python3 python_intro.py +Hi Rachel! +Next girl +Hi Monica! +Next girl +Hi Phoebe! +Next girl +Hi Ola! +Next girl +Hi You! +Next girl +``` + +As you can see, everything you put inside a `for` statement with an indent will be repeated for every element of the list +`girls`. + +You can also use `for` on numbers using the `range` function: + +{% filename %}python_intro.py{% endfilename %} +```python +for i in range(1, 6): + print(i) +``` + +Which would print: + +{% filename %}command-line{% endfilename %} +``` +1 +2 +3 +4 +5 +``` + +`range` is a function that creates a list of numbers following one after the other (these numbers are provided by you as +parameters). + +Note that the second of these two numbers is not included in the list that is output by Python (meaning `range(1, 6)` counts +from 1 to 5, but does not include the number 6). That is because "range" is half-open, and by that we mean it includes the first +value, but not the last. + +## Summary + +That's it. __You totally rock!__ This was a tricky chapter, so you should feel proud of yourself. We're definitely proud of you +for making it this far! + +For official and full python tutorial visit https://docs.python.org/3/tutorial/. This will give you a more thorough and complete +study of the language. Cheers! :) + +You might want to briefly do something else – stretch, walk around for a bit, rest your eyes – before going on to the next chapter. :) + + +![Cupcake](images/cupcake.png) diff --git a/en/runcode/README.md b/en/runcode/README.md new file mode 100644 index 00000000000..6ee9a6b2e49 --- /dev/null +++ b/en/runcode/README.md @@ -0,0 +1,54 @@ +# RunCode Cloud Environment setup + +> **Note** If you already worked through the installation steps, no need to do this again – youcan skip straight ahead to [How the Internet works](../how_the_internet_works/README.md). + +# Installation +In this tutorial you will be building a blog. In order to do that, as you go through the tutorial you'll be instructed on how to set up some online accounts as needed. + +Since you are using RunCode Cloud development environment, your installation experience will be a little different. You do not need to install anything locally, you just need to create three online accounts. + +# RunCode Setup +With RunCode, you only need to create three online accounts and install Django on your development environment. This page gathers all of the installation and sign-up instructions in one place (which is useful for some workshop formats). + +## GitHub {#github} +Go to [GitHub.com](https://github.com/) and sign up for a new, free user account. + +## RunCode {#runcode} +Go to [RunCode.io](https://runcode.io/) and sign up for a new, free user account. You need to have a [Google.com](https://www.google.com/intl/en-GB/gmail/about/) account or [GitHub.com](https://github.com/) which you can sign up with. + +## Visual Studio Code on RunCode {#visual-studio-runcode} +Visual Studio Code is a source code editor developed by Microsoft for Windows, Linux and macOS. +It includes support for debugging, embedded Git control, syntax highlighting, intelligent code completion, snippets, and code refactoring. + +You do not need to install Python as it is pre-installed on their platform so you can skip straight ahead to the next chapter! + +## PythonAnywhere {#pythonanywhere} +{% include "/deploy/signup_pythonanywhere.md" %} + +## Command Line {#command-line} +To open the Ubuntu terminal on RunCode, go to Workspaces → New Workspace → Blank. This will open a new Visual Studio Code workspace which has an Ubuntu terminal in the bottom pane. + +Altenatively, you can go to Workspaces → New Workspace → Jupyter Lab. This will open a Python prompt which is depicted by `>>>`, you can type `exit()` to get back to the Ubuntu terminal. + +Ubuntu is a version of Linux so for all command line instructions later in the tutorial you can follow Linux instructions. + +## Installing Django {#django} + +{% include "django_installation/instructions.md" %} + +# Start reading + +Congratulations, you are all set up and ready to go! If you still have some time before the workshop, it would be useful to start reading a few of the beginning chapters: + +* [How the internet works](../how_the_internet_works/README.md) + +* [Introduction to the command line](../runcode/intro_to_command_line/README.md) + +* [Introduction to Python](../runcode/python_introduction/README.md) + +* [What is Django?](../django/README.md) + + +# Enjoy the workshop! + +When you begin the workshop, you'll be able to go straight to [Your first Django project!](../runcode/django_start_project/README.md) because you already covered the material in the earlier chapters. diff --git a/en/runcode/deploy/README.md b/en/runcode/deploy/README.md new file mode 100644 index 00000000000..cff94ebffe6 --- /dev/null +++ b/en/runcode/deploy/README.md @@ -0,0 +1,164 @@ +# Deploy! + +> **Note** The following chapter can be sometimes a bit hard to get through. Persist and finish it; deployment is an important part of the website development process. This chapter is placed in the middle of the tutorial so that your mentor can help with the slightly trickier process of getting your website online. This means you can still finish the tutorial on your own if you run out of time. + +Until now, your website was only available on your computer. Now you will learn how to deploy it! Deploying is the process of publishing your application on the Internet so people can finally go and see your app. :) + +As you learned, a website has to be located on a server. There are a lot of server providers available on the internet, we're going to use [PythonAnywhere](https://www.pythonanywhere.com/). PythonAnywhere is free for small applications that don't have too many visitors so it'll definitely be enough for you now. + +The other external service we'll be using is [GitHub](https://www.github.com), which is a code hosting service. There are others out there, but almost all programmers have a GitHub account these days, and now so will you! These three places will be important to you. Your local computer will be the place where you do development and testing. When you're happy with the changes, you will place a copy of your program on GitHub. Your website will be on PythonAnywhere and you will update it by getting a new copy of your code from GitHub. + +# Git + +> **Note** On RunCode, Git is preinstalled so you do not need to install it - you can skip to the next section and start creating your Git repository. + +## Starting our Git repository + +Git tracks changes to a particular set of files in what's called a code repository (or "repo" for short). Let's start one for our project. Open up your console and run these commands, in the `djangogirls` directory: + +> **Note** Check your current working directory with a `pwd` (Linux) command before initializing the repository. You should be in the `djangogirls` folder. + +{% filename %}command-line{% endfilename %} +``` +$ git init +Initialized empty Git repository in ~/djangogirls/.git/ +$ git config --global user.name "Your Name" +$ git config --global user.email you@example.com +``` +Initializing the git repository is something we need to do only once per project (and you won't have to re-enter the username and email ever again). + +### Adjusting your branch name +If the version of Git that you are using is older than **2.28**, you will need to change the name of your branch to "main". To determine the version of Git, please enter the following command: + +{% filename %}command-line{% endfilename %} +``` +$ git --version +git version 2.xx... +``` + +Only if the second number of the version, shown as "xx" above, is less than 28, will you need to enter the following command to rename your branch. If it is 28 or higher, please continue to "Ignoring files". As in "Initializing", this is something we need to do only once per project, as well as only when your version of Git is less than 2.28: + +{% filename %}command-line{% endfilename %} +``` +$ git branch -M main +``` + +### Ignoring files + +Git will track changes to all the files and folders in this directory, but there are some files we want it to ignore. We do this by creating a file called `.gitignore` in the base directory. Open up your editor and create a new file with the following contents: + +{% filename %}.gitignore{% endfilename %} +``` +# Python +*.pyc +*~ +__pycache__ + +# Env +.env +myvenv/ +venv/ + +# Database +db.sqlite3 + +# Static folder at project root +/static/ + +# Visual Studio +.vscode/ +.history/ +*.code-workspace +``` + +And save it as `.gitignore` in the "djangogirls" folder. + +> **Note** The dot at the beginning of the file name is important! If you're having any difficulty creating it (Macs don't like you to create files that begin with a dot via the Finder, for example), then use the "Save As" feature in your editor; it's bulletproof. And be sure not to add `.txt`, `.py`, or any other extension to the file name -- it will only be recognized by Git if the name is just `.gitignore`. Linux and MacOS treat files with a name that starts with `.` (such as `.gitignore`) as hidden and the normal `ls` command won't show these files. Instead use `ls -a` to see the `.gitignore` file. + +> **Note** One of the files you specified in your `.gitignore` file is `db.sqlite3`. That file is your local database, where all of your users and posts are stored. We'll follow standard web programming practice, meaning that we'll use separate databases for your local testing site and your live website on PythonAnywhere. The PythonAnywhere database could be SQLite, like your development machine, but usually you will use one called MySQL which can deal with a lot more site visitors than SQLite. Either way, by ignoring your SQLite database for the GitHub copy, it means that all of the posts and superuser you created so far are going to only be available locally, and you'll have to create new ones on production. You should think of your local database as a good playground where you can test different things and not be afraid that you're going to delete your real posts from your blog. + +It's a good idea to use a `git status` command before `git add` or whenever you find yourself unsure of what has changed. This will help prevent any surprises from happening, such as wrong files being added or committed. The `git status` command returns information about any untracked/modified/staged files, the branch status, and much more. The output should be similar to the following: + + +{% filename %}command-line{% endfilename %} +``` +$ git status +On branch main + +No commits yet + +Untracked files: + (use "git add ..." to include in what will be committed) + + .gitignore + blog/ + manage.py + mysite/ + requirements.txt + +nothing added to commit but untracked files present (use "git add" to track) +``` + +And finally we save our changes. Go to your console and run these commands: + +{% filename %}command-line{% endfilename %} +``` +$ git add . +$ git commit -m "My Django Girls app, first commit" + [...] + 13 files changed, 200 insertions(+) + create mode 100644 .gitignore + [...] + create mode 100644 mysite/wsgi.py +``` + + +## Pushing your code to GitHub + +Go to [GitHub.com](https://www.github.com) and sign up for a new, free user account. (If you already did that in the workshop prep, that is great!) Be sure to remember your password (add it to your password manager, if you use one). + +Then, create a new repository, giving it the name "my-first-blog". Leave the "initialize with a README" checkbox unchecked, leave the .gitignore option blank (we've done that manually) and leave the License as None. + +![](images/new_github_repo.png) + +> **Note** The name `my-first-blog` is important – you could choose something else, but it's going to occur lots of times in the instructions below, and you'd have to substitute it each time. It's probably easier to stick with the name `my-first-blog`. + +On the next screen, you'll be shown your repo's clone URL, which you will use in some of the commands that follow: + +![](images/github_get_repo_url_screenshot.png) + +Now we need to hook up the Git repository on your computer to the one up on GitHub. + +Type the following into your console (replace `` with the username you entered when you created your GitHub account, but without the angle-brackets -- the URL should match the clone URL you just saw). + +{% filename %}command-line{% endfilename %} +``` +$ git remote add origin https://github.com//my-first-blog.git +$ git push -u origin main +``` + +When you push to GitHub, you'll be asked for your GitHub username and password (either right there in the command-line window or in a pop-up window), and after entering credentials you should see something like this: + +{% filename %}command-line{% endfilename %} +``` +Counting objects: 6, done. +Writing objects: 100% (6/6), 200 bytes | 0 bytes/s, done. +Total 3 (delta 0), reused 0 (delta 0) +To https://github.com/ola/my-first-blog.git + * [new branch] main -> main +Branch main set up to track remote branch main from origin. +``` + + + +Your code is now on GitHub. Go and check it out! You'll find it's in fine company – [Django](https://github.com/django/django), the [Django Girls Tutorial](https://github.com/DjangoGirls/tutorial), and many other great open source software projects also host their code on GitHub. :) + +{% include "/deploy/pythonanywhere.md" %} + +# Check out your site! + +The default page for your site should say "It worked!", just like it does on your local computer. Try adding `/admin/` to the end of the URL, and you'll be taken to the admin site. Log in with the username and password, and you'll see you can add new Posts on the server -- remember, the posts from your local test database were not sent to your live blog. + +Once you have a few posts created, you can go back to your local setup (not PythonAnywhere). From here you should work on your local setup to make changes. This is a common workflow in web development – make changes locally, push those changes to GitHub, and pull your changes down to your live Web server. This allows you to work and experiment without breaking your live Web site. Pretty cool, huh? + +Give yourself a *HUGE* pat on the back! Server deployments are one of the trickiest parts of web development and it often takes people several days before they get them working. But you've got your site live, on the real Internet! diff --git a/en/runcode/deploy/images/github_get_repo_url_screenshot.png b/en/runcode/deploy/images/github_get_repo_url_screenshot.png new file mode 100644 index 00000000000..ee1560b1e85 Binary files /dev/null and b/en/runcode/deploy/images/github_get_repo_url_screenshot.png differ diff --git a/en/runcode/deploy/images/new_github_repo.png b/en/runcode/deploy/images/new_github_repo.png new file mode 100644 index 00000000000..d1f82e5d863 Binary files /dev/null and b/en/runcode/deploy/images/new_github_repo.png differ diff --git a/en/runcode/deploy/images/pythonanywhere_account.png b/en/runcode/deploy/images/pythonanywhere_account.png new file mode 100644 index 00000000000..612d4528e11 Binary files /dev/null and b/en/runcode/deploy/images/pythonanywhere_account.png differ diff --git a/en/runcode/deploy/images/pythonanywhere_bash_console.png b/en/runcode/deploy/images/pythonanywhere_bash_console.png new file mode 100644 index 00000000000..68eb2a030e1 Binary files /dev/null and b/en/runcode/deploy/images/pythonanywhere_bash_console.png differ diff --git a/en/runcode/deploy/images/pythonanywhere_beginner_account_button.png b/en/runcode/deploy/images/pythonanywhere_beginner_account_button.png new file mode 100644 index 00000000000..c1be0a14132 Binary files /dev/null and b/en/runcode/deploy/images/pythonanywhere_beginner_account_button.png differ diff --git a/en/runcode/deploy/images/pythonanywhere_create_api_token.png b/en/runcode/deploy/images/pythonanywhere_create_api_token.png new file mode 100644 index 00000000000..abae45ae37a Binary files /dev/null and b/en/runcode/deploy/images/pythonanywhere_create_api_token.png differ diff --git a/en/runcode/django_installation/README.md b/en/runcode/django_installation/README.md new file mode 100644 index 00000000000..859ed3e33f2 --- /dev/null +++ b/en/runcode/django_installation/README.md @@ -0,0 +1,9 @@ +# Django installation + +> **Note** If you already worked through the [installation steps](../installation/README.md) then you've already done this –you can go straight to the next chapter! + +> Part of this section is based on tutorials by Geek Girls Carrots (https://github.com/ggcarrots/django-carrots). + +> Part of this section is based on the [django-marcador tutorial](http://django-marcador.keimlink.de/) licensed under the Creative Commons Attribution-ShareAlike 4.0 International License. The django-marcador tutorial is copyrighted by Markus Zapke-Gründemann et al. + +{% include "instructions.md" %} diff --git a/en/cloud_development_setup/instructions.md b/en/runcode/django_installation/instructions.md similarity index 59% rename from en/cloud_development_setup/instructions.md rename to en/runcode/django_installation/instructions.md index 9e89fcc288d..2e90c7c545a 100644 --- a/en/cloud_development_setup/instructions.md +++ b/en/runcode/django_installation/instructions.md @@ -1,30 +1,9 @@ -If you are using RunCode Cloud development environment, your installation experience will be a little different. You can ignore the rest of the installation instructions as you do not need to install anything locally, you just need to create three online accounts. - -## Create a GitHub account -Go to [GitHub.com](https://github.com/) and sign up for a new, free user account.Skip this step if you already did -this in the previous step so you could sign up for RunCode. - -## Create a RunCode account -Go to [RunCode.io](https://runcode.io/) and sign up for a new, free user account. You need to have a -[Google.com](https://www.google.com/intl/en-GB/gmail/about/) account or [GitHub.com](https://github.com/) -which you can sign up with. - -## Create a PythonAnywhere account {#pythonanywhere-account} -{% include "/deploy/signup_pythonanywhere.md" %} - -## Command Line -To open the Ubuntu terminal on RunCode, go to Workspaces → New Workspace → Blank. This will open a new Visual Studio Code workspace which has an Ubuntu terminal in the bottom pane. - -Altenatively, you can go to Workspaces → New Workspace → Jupyter Lab. This will open a Python prompt which is depicted by `>>>`, you can type `exit()` to get back to the Ubuntu terminal. - -Ubuntu is a version of Linux so for all command line instructions later in the tutorial you can follow Linux instructions. - -## Virtual Environment +### Virtual Environment Before we install Django we will get you to install an extremely useful tool to help keep your coding environment tidy on your computer. It's possible to skip this step, but it's highly recommended. Starting with the best possible setup will save you a lot of trouble in the future! So, let's create a **virtual environment** (also called a *virtualenv*). Virtualenv will isolate your Python/Django setup on a per-project basis. This means that any changes you make to one website won't affect any others you're also developing. Neat, right? -All you need to do is find a directory in which you want to create the `virtualenv`; your home directory, for example. On Windows, it might look like `C:\Users\Name\` (where `Name` is the name of your login). +All you need to do is find a directory in which you want to create the `virtualenv`; your home directory, for example. On Runcode, it might look like `ubuntu@runcode:~$`. For this tutorial we will be using a new directory `djangogirls` from your home directory: @@ -36,8 +15,7 @@ $ cd djangogirls We will make a virtualenv called `myvenv`. -To create a new `virtualenv` on RunCode, you first need to install the `virtualenv` module. To do so, first you need to update -the packages in your environment +To create a new `virtualenv` on RunCode, you first need to install the `virtualenv` module. To do so, first you need to update the packages in your environment >``` >$ sudo apt-get update -y >``` @@ -52,7 +30,7 @@ the packages in your environment >``` > and a new `virtualenv` with the name `myvenv` or whatever name you chose should be created in your `djangogirls` folder. -## Working with a Virtual Environment +### Working with a Virtual Environment >Start your virtual environment by running: >``` >$ . myvenv/bin/activate @@ -60,8 +38,7 @@ the packages in your environment ### Installing packages with requirements -A requirements file keeps a list of dependencies to be installed using -`pip install`: +A requirements file keeps a list of dependencies to be installed using `pip install`: First create a `requirements.txt` file inside of the `djangogirls/` folder, using the code editor that you installed earlier. You do this by opening a new file in the code editor and then saving it as `requirements.txt` in the `djangogirls/` folder. Your directory will look like this: @@ -90,4 +67,4 @@ Installing collected packages: Django Successfully installed Django-{{ book.django_version }} ``` -That's it! You're now (finally) ready to create a Django application! \ No newline at end of file +That's it! You're now (finally) ready to create a Django application! diff --git a/en/runcode/django_start_project/README.md b/en/runcode/django_start_project/README.md new file mode 100644 index 00000000000..d1b4a17a27f --- /dev/null +++ b/en/runcode/django_start_project/README.md @@ -0,0 +1,168 @@ +# Your first Django project! + +> Part of this chapter is based on tutorials by Geek Girls Carrots (https://github.com/ggcarrots/django-carrots). + +> Parts of this chapter are based on the [django-marcador tutorial](http://django-marcador.keimlink.de/) licensed under the Creative Commons Attribution-ShareAlike 4.0 International License. The django-marcador tutorial is copyrighted by Markus Zapke-Gründemann et al. + +We're going to create a small blog! + +The first step is to start a new Django project. Basically, this means that we'll run some scripts provided by Django that will create the skeleton of a Django project for us. This is just a bunch of directories and files that we will use later. + +The names of some files and directories are very important for Django. You should not rename the files that we are about to create. Moving them to a different place is also not a good idea. Django needs to maintain a certain structure to be able to find important things. + +> Remember to run everything in the virtualenv. If you don't see a prefix `(myvenv)` in your console, you need to activate your virtualenv. We explained how to do that in the __Django installation__ chapter in the __Working with virtualenv__ part. Typing `source myvenv/bin/activate` will do this for you. + +In your Linux console, you should run the following command. **Don't forget to add the period (or dot) `.` at the end!** + +{% filename %}command-line{% endfilename %} +``` +(myvenv) ~/djangogirls$ django-admin startproject mysite . +``` + +> The period `.` is crucial because it tells the script to install Django in your current directory (for which the period `.` is a short-hand reference). + +> **Note** When typing the command above, remember that you only type the part which starts by `django-admin`. The `(myvenv) ~/djangogirls$` part shown here is just example of the prompt that will be inviting your input on your command line. + +`django-admin.py` is a script that will create the directories and files for you. You should now have a directory structure which looks like this: + +``` +djangogirls +├── manage.py +├── mysite +│   ├── asgi.py +│   ├── __init__.py +│   ├── settings.py +│   ├── urls.py +│   └── wsgi.py +├── myvenv +│   └── ... +└── requirements.txt +``` +> **Note**: in your directory structure, you will also see your `myvenv` directory that we created before. + +`manage.py` is a script that helps with management of the site. With it we will be able (amongst other things) to start a web server on our computer without installing anything else. + +The `settings.py` file contains the configuration of your website. + +Remember when we talked about a mail carrier checking where to deliver a letter? `urls.py` file contains a list of patterns used by `urlresolver`. + +Let's ignore the other files for now as we won't change them. The only thing to remember is not to delete them by accident! + + +## Changing settings + +Let's make some changes in `mysite/settings.py`. Open the file using the code editor you installed earlier. + +**Note**: Keep in mind that `settings.py` is a regular file, like any other. You can open it from inside the code editor, using the "file -> open" menu actions. This should get you the usual window in which you can navigate to your `settings.py` file and select it. Alternatively, you can open the file by navigating to the djangogirls folder on your desktop and right-clicking on it. Then, select your code editor from the list. Selecting the editor is important as you might have other programs installed that can open the file but will not let you edit it. + +It would be nice to have the correct time on our website. Go to [Wikipedia's list of time zones](https://en.wikipedia.org/wiki/List_of_tz_database_time_zones) and copy your relevant time zone (TZ) (e.g. `Europe/Berlin`). + +In `settings.py`, find the line that contains `TIME_ZONE` and modify it to choose your own timezone. For example: + +{% filename %}mysite/settings.py{% endfilename %} +```python +TIME_ZONE = 'Europe/Berlin' +``` + +A language code consist of the language, e.g. `en` for English or `de` for German, and the country code, e.g. `de` for Germany or `ch` for Switzerland. If English is not your native language, you can add this to change the default buttons and notifications from Django to be in your language. So you would have "Cancel" button translated into the language you defined here. [Django comes with a lot of prepared translations](https://docs.djangoproject.com/en/3.2/ref/settings/#language-code). + +If you want a different language, change the language code by changing the following line: + +{% filename %}mysite/settings.py{% endfilename %} +```python +LANGUAGE_CODE = 'de-ch' +``` + +We'll also need to add a path for static files. (We'll find out all about static files and CSS later in the tutorial.) Go down to the *end* of the file, and just underneath the `STATIC_URL` entry, add a new one called `STATIC_ROOT`: + +{% filename %}mysite/settings.py{% endfilename %} +```python +STATIC_URL = '/static/' +STATIC_ROOT = BASE_DIR / 'static' +``` + +When `DEBUG` is `True` and `ALLOWED_HOSTS` is empty, the host is validated against `['localhost', '127.0.0.1', '[::1]']`. This won't match our hostname on RunCode and on PythonAnywhere once we deploy our application so we will change the following setting: + +{% filename %}mysite/settings.py{% endfilename %} +```python +ALLOWED_HOSTS = ['127.0.0.1', '.runcode.io', '.pythonanywhere.com'] +``` + +## Set up a database + +There's a lot of different database software that can store data for your site. We'll use the default one, `sqlite3`. + +This is already set up in this part of your `mysite/settings.py` file: + +{% filename %}mysite/settings.py{% endfilename %} +```python +DATABASES = { + 'default': { + 'ENGINE': 'django.db.backends.sqlite3', + 'NAME': BASE_DIR / 'db.sqlite3', + } +} +``` + +To create a database for our blog, let's run the following in the console: `python manage.py migrate` (we need to be in the `djangogirls` directory that contains the `manage.py` file). If that goes well, you should see something like this: + +{% filename %}command-line{% endfilename %} +``` +(myvenv) ~/djangogirls$ python manage.py migrate +Operations to perform: + Apply all migrations: admin, auth, contenttypes, sessions +Running migrations: + Applying contenttypes.0001_initial... OK + Applying auth.0001_initial... OK + Applying admin.0001_initial... OK + Applying admin.0002_logentry_remove_auto_add... OK + Applying admin.0003_logentry_add_action_flag_choices... OK + Applying contenttypes.0002_remove_content_type_name... OK + Applying auth.0002_alter_permission_name_max_length... OK + Applying auth.0003_alter_user_email_max_length... OK + Applying auth.0004_alter_user_username_opts... OK + Applying auth.0005_alter_user_last_login_null... OK + Applying auth.0006_require_contenttypes_0002... OK + Applying auth.0007_alter_validators_add_error_messages... OK + Applying auth.0008_alter_user_username_max_length... OK + Applying auth.0009_alter_user_last_name_max_length... OK + Applying auth.0010_alter_group_name_max_length... OK + Applying auth.0011_update_proxy_permissions... OK + Applying auth.0012_alter_user_first_name_max_length... OK + Applying sessions.0001_initial... OK +``` + +And we're done! Time to start the web server and see if our website is working! + +## Starting the web server + +You need to be in the directory that contains the `manage.py` file (the `djangogirls` directory). In the console, we can start the web server by running `python manage.py runserver`: + +{% filename %}command-line{% endfilename %} +``` +(myvenv) ~/djangogirls$ python manage.py runserver +``` + +Now you need to check that your website is running. On RunCode cloud platform, the URL will look something like this: `https://8000-soft-limit-18855079.eu-ws4.runcode.io/`. Open another tab/window in your browser (Firefox, Chrome, Safari, Internet Explorer or whatever you use) and enter the address to your instance. + +The URL to your own instance, will be like: + +{% filename %}browser{% endfilename %} +``` +https://8000-the-name-of-your-runcode-instance.eu-ws4.runcode.io/ +``` +You can open this in another browser window and you should see the Django 'Installation done' page. + +Congratulations! You've just created your first website and run it using a web server! Isn't that awesome? + +Congratulations! You've just created your first website and run it using a web server! Isn't that awesome? + +![Install worked!](images/install_worked.png) + +Note that a command window can only run one thing at a time, and the command window you opened earlier is running the web server. As long as the web server is running and waiting for additional incoming requests, the terminal will accept new text but will not execute new commands. + +> We reviewed how web servers work in the How the Internet works chapter. + +To type additional commands while the web server is running, open a new terminal window and activate your virtualenv -- to review instructions on how to open a second terminal window, see [Introduction to the command line](../intro_to_command_line/README.md). To stop the web server, switch back to the window in which it's running and press CTRL+C - Control and C keys together (on Windows, you might have to press Ctrl+Break). + +Ready for the next step? It's time to create some content! diff --git a/en/runcode/django_start_project/images/install_worked.png b/en/runcode/django_start_project/images/install_worked.png new file mode 100644 index 00000000000..4354c634ddb Binary files /dev/null and b/en/runcode/django_start_project/images/install_worked.png differ diff --git a/en/runcode/intro_to_command_line/README.md b/en/runcode/intro_to_command_line/README.md new file mode 100644 index 00000000000..2f06d54e993 --- /dev/null +++ b/en/runcode/intro_to_command_line/README.md @@ -0,0 +1,246 @@ +# Introduction to the command-line interface + +> For readers at home: this chapter is covered in the +[Your new friend: Command Line](https://www.youtube.com/watch?v=jvZLWhkzX-8) video. + +It's exciting, right?! You'll write your first line of code in just a few minutes! :) + +__Let us introduce you to your first new friend: the command line!__ + +The following steps will show you how to use the black window all hackers use. It might look a bit scary at first but really it's just a prompt waiting for commands from you. + +> **Note** Please note that throughout this book we use the terms 'directory' and 'folder' interchangeably but they are one and the same thing. + +## What is the command line? + +The window, which is usually called the __command line__ or __command-line interface__, is a text-based application for viewing, handling, and manipulating files on your computer. It's much like Windows Explorer or Finder on the Mac, but without the graphical interface. Other names for the command line are: *cmd*, *CLI*, *prompt*, *console* or *terminal*. + +## Open the command-line interface + +To start some experiments we need to open our command-line interface first. + +To open the Ubuntu terminal on RunCode, go to Workspaces → New Workspace → Blank. This will open a new Visual Studio Code workspace which has an Ubuntu terminal in the bottom pane. + +Altenatively, you can go to Workspaces → New Workspace → Jupyter Lab. This will open a Python prompt which is depicted by `>>>`, you can type `exit()` to get back to the Ubuntu terminal. + +Ubuntu is a version of Linux so from now on you can follow Linux instructions. + + +## Prompt + +You now should see a white or black window that is waiting for your commands. + + +On Ubuntu Linux, you probably see a `$`, like this: + +{% filename %}command-line{% endfilename %} +``` +$ +``` + +Each command will be prepended by a `$` and one space, but you should not type it. Your computer will do it for you. :) + +> Just a small note: in your case there may be something like `Olas-MacBook-Air:~ ola$` before the prompt sign, and this is 100% OK. + +The part up to and including the `$` is called the *command line prompt*, or *prompt* for short. It prompts you to input something there. + +In the tutorial, when we want you to type in a command, we will include the `$`, and occasionally more to the left. Ignore the left part and only type in the command, which starts after the prompt. + +## Your first command (YAY!) + +Let's start by typing this command: + +{% filename %}command-line{% endfilename %} +``` +$ whoami +``` + +And then hit `enter`. This is our result: + +{% filename %}command-line{% endfilename %} +``` +$ whoami +olasitarska +``` + +As you can see, the computer has just printed your username. Neat, huh? :) + +> Try to type each command; do not copy-paste. You'll remember more this way! + +## Basics + +Each operating system has a slightly different set of commands for the command line, so make sure to follow instructions for your operating system. Let's try this, shall we? + +### Current directory + +It'd be nice to know where are we now, right? Let's see. Type this command and hit `enter`: + +{% filename %}command-line{% endfilename %} +``` +$ pwd +/Users/olasitarska +``` + +> Note: 'pwd' stands for 'print working directory'. + +You'll probably see something similar on your machine. Once you open the command line you usually start at your user's home directory. + +--- + +### Learn more about a command + +Many commands you can type at the command prompt have built-in help that you can display and read! For example, to learn more about the current directory command: + +Linux has a `man` command, which gives you help on commands. Try `man pwd` and see what it says, or put `man` before other commands to see their help. The output of `man` is normally paged. Use the space bar to move to the next page, and `q` to quit looking at the help. + +### List files and directories + +So what's in it? It'd be cool to find out. Let's see: + +{% filename %}command-line{% endfilename %} +``` +$ ls +Applications +Desktop +Downloads +Music +... +``` + +--- + +### Change current directory + +Now, let's go to our Desktop directory: + +{% filename %}command-line{% endfilename %} +``` +$ cd Desktop +``` + +Note that the directory name "Desktop" might be translated to the language of your Linux account. If that's the case, you'll need to replace `Desktop` with the translated name; for example, `Schreibtisch` for German. + +Check if it's really changed: + +{% filename %}command-line{% endfilename %} +``` +$ pwd +/Users/olasitarska/Desktop +``` + +Here it is! + +> PRO tip: if you type `cd D` and then hit `tab` on your keyboard, the command line will automatically fill in the rest of the name so you can navigate faster. If there is more than one folder starting with "D", hit the `tab` key twice to get a list of options. + +--- + +### Create directory + +How about creating a practice directory on your desktop? You can do it this way: + +{% filename %}command-line{% endfilename %} +``` +$ mkdir practice +``` + +This little command will create a folder with the name `practice` on your desktop. You can check if it's there by looking on your Desktop or by running a `ls` or `dir` command! Try it. :) + +> PRO tip: If you don't want to type the same commands over and over, try pressing the `up arrow` and `down arrow` on your keyboard to cycle through recently used commands. + +--- + +### Exercise! + +A small challenge for you: in your newly created `practice` directory, create a directory called `test`. (Use the `cd` and `mkdir` commands.) + +#### Solution: + +{% filename %}command-line{% endfilename %} +``` +$ cd practice +$ mkdir test +$ ls +test +``` + +Congrats! :) + +--- + +### Clean up + +We don't want to leave a mess, so let's remove everything we did until that point. + +First, we need to get back to Desktop: + +{% filename %}command-line{% endfilename %} +``` +$ cd .. +``` + +{% filename %}command-line{% endfilename %} +``` +> cd .. +``` + +Using `..` with the `cd` command will change your current directory to the parent directory (that is, the directory that contains your current directory). + +Check where you are: + +{% filename %}command-line{% endfilename %} +``` +$ pwd +/Users/olasitarska/Desktop +``` + +Now time to delete the `practice` directory: + +> __Attention__: Deleting files using `del`, `rmdir` or `rm` is irrecoverable, meaning _the deleted files will be gone forever_! So be very careful with this command. + +{% filename %}command-line{% endfilename %} +``` +$ rm -r practice +``` + +Done! To be sure it's actually deleted, let's check it: + +{% filename %}command-line{% endfilename %} +``` +$ ls +``` + +### Exit + +That's it for now! You can safely close the command line now. Let's do it the hacker way, alright? :) + +{% filename %}command-line{% endfilename %} +``` +$ exit +``` + +Cool, huh? :) + +## Summary + + Here is a summary of some useful commands: + +Command (Windows) | Command (Mac OS / Linux) | Description | Example +----------------- | ------------------------ | -------------------------- | --------------------------------------------- +exit | exit | close the window | **exit** +cd | cd | change directory | **cd test** +cd | pwd | show the current directory | **cd** (Windows) or **pwd** (Mac OS / Linux) +dir | ls | list directories/files | **dir** +copy | cp | copy file | **copy c:\test\test.txt c:\windows\test.txt** +move | mv | move file | **move c:\test\test.txt c:\windows\test.txt** +mkdir | mkdir | create a new directory | **mkdir testdirectory** +rmdir (or del) | rm | delete a file | **del c:\test\test.txt** +rmdir /S | rm -r | delete a directory | **rm -r testdirectory** +[CMD] /? | man [CMD] | get help for a command | **cd /?** (Windows) or **man cd** (Mac OS / Linux) + +These are just a very few of the commands you can run in your command line, but you're not going to use anything more than that today. + +If you're curious, [ss64.com](http://ss64.com) contains a complete reference of commands for all operating systems. + +## Ready? + +Let's dive into Python! diff --git a/en/runcode/python_introduction/README.md b/en/runcode/python_introduction/README.md new file mode 100644 index 00000000000..28c1e9a9153 --- /dev/null +++ b/en/runcode/python_introduction/README.md @@ -0,0 +1,16 @@ +{% set warning_icon = '' %} + +# Introduction to Python + +> Part of this chapter is based on tutorials by Geek Girls Carrots (https://github.com/ggcarrots/django-carrots). + +Let's write some code! + +{% include "prompt.md" %} + +{% include "/python_introduction/instructions.md" %} + +{% include "/linux/python_introduction/instructions.md" %} + +{% include "/python_introduction/instructions_part_two.md" %} + diff --git a/en/runcode/python_introduction/images/cupcake.png b/en/runcode/python_introduction/images/cupcake.png new file mode 100644 index 00000000000..8c1820adee8 Binary files /dev/null and b/en/runcode/python_introduction/images/cupcake.png differ diff --git a/en/runcode/python_introduction/prompt.md b/en/runcode/python_introduction/prompt.md new file mode 100644 index 00000000000..515df8fd9fc --- /dev/null +++ b/en/runcode/python_introduction/prompt.md @@ -0,0 +1,21 @@ +## Python prompt + +> For readers at home: this part is covered in the [Python Basics: Integers, Strings, Lists, Variables and Errors](https://www.youtube.com/watch?v=MO63L4s-20U) video. + +To start playing with Python, we need to open up a *command line* on RunCode. You should already know how to do that – you learned it in the [Intro to Command Line](../intro_to_command_line/README.md) chapter. + +Once you're ready, follow the instructions below. + +We want to open up a Python console, so type in `python3` on Linux and hit `enter`. + +{% filename %}command-line{% endfilename %} +``` +$ python3 +Python {{ book.py_release }} (...) +Type "help", "copyright", "credits" or "license" for more information. +>>> +``` + +Another way to open the Python terminal on RunCode, is to go to Workspaces → New Workspace → Jupyter Lab. This will open a Python prompt which is depicted by `>>>`. + +`ubuntu@runcode:~$ python3` diff --git a/en/windows/README.md b/en/windows/README.md new file mode 100644 index 00000000000..b9af71d2c2a --- /dev/null +++ b/en/windows/README.md @@ -0,0 +1,49 @@ +# Windows Installation + +> **Note** If you already worked through the installation steps, no need to do this again – you can skip straight ahead to [How the Internet works](../how_the_internet_works/README.md). + +# Installation +In this tutorial you will be building a blog. In order to do that, as you go through the tutorial you'll be instructed on how to install various software on your computer and set up some online accounts as needed. This page gathers all of the installation and sign-up instructions in one place (which is useful for some workshop formats). + +Since you're working on Windows, your experience will be a little different. When you get to the deployment chapter, you will experience Linux environment and you can always refer to the [Linux command line instructions](linux/intro_to_command_line/README.md) if you need to learn more on Linux command line. + +To install software on your machine, follow the instructions below: + +## Brief intro to the command line {#intro-command-line} +Many of the steps below reference the "console", "terminal", "command window", or "command line" -- these all mean the same thing: a window on your computer where you can enter commands. When you get to the main tutorial, you'll learn more about the command line. For now, the main thing you need to know is how to open a command window and what it looks like: + +{% include "intro_to_command_line/open_instructions.md" %} + +## Install Python {#python} +{% include "python_installation/instructions.md" %} + +## Install a code editor {#code-editor} +{% include "/code_editor/instructions.md" %} + +## Set up virtualenv and install Django {#virtualenv} +{% include "django_installation/instructions.md" %} + +## Install Git {#git} +{% include "deploy/install_git.md" %} + +## Create a GitHub account {#github-account} +Go to [GitHub.com](https://www.github.com) and sign up for a new, free user account. Be sure to remember your password (add it to your password manager, if you use one). + +## Create a PythonAnywhere account {#pythonanywhere-account} +{% include "/deploy/signup_pythonanywhere.md" %} + +# Start reading + +Congratulations, you are all set up and ready to go! If you still have some time before the workshop, it would be useful to start reading a few of the beginning chapters: + +* [How the internet works](../how_the_internet_works/README.md) + +* [Introduction to the command line](../windows/intro_to_command_line/README.md) + +* [Introduction to Python](../windows/python_introduction/README.md) + +* [What is Django?](../django/README.md) + +# Enjoy the workshop! + +When you begin the workshop, you'll be able to go straight to [Your first Django project!](../windows/django_start_project/README.md) because you already covered the material in the earlier chapters. diff --git a/en/windows/deploy/README.md b/en/windows/deploy/README.md new file mode 100644 index 00000000000..679f8c6fbe0 --- /dev/null +++ b/en/windows/deploy/README.md @@ -0,0 +1,176 @@ +# Deploy! + +> **Note** The following chapter can be sometimes a bit hard to get through. Persist and finish it; deployment is an important part of the website development process. This chapter is placed in the middle of the tutorial so that your mentor can help with the slightly trickier process of getting your website online. This means you can still finish the tutorial on your own if you run out of time. + +Until now, your website was only available on your computer. Now you will learn how to deploy it! Deploying is the process of publishing your application on the Internet so people can finally go and see your app. :) + +As you learned, a website has to be located on a server. There are a lot of server providers available on the internet, we're going to use [PythonAnywhere](https://www.pythonanywhere.com/). PythonAnywhere is free for small applications that don't have too many visitors so it'll definitely be enough for you now. + +The other external service we'll be using is [GitHub](https://www.github.com), which is a code hosting service. There are others out there, but almost all programmers have a GitHub account these days, and now so will you! + +These three places will be important to you. Your local computer will be the place where you do development and testing. When you're happy with the changes, you will place a copy of your program on GitHub. Your website will be on PythonAnywhere and you will update it by getting a new copy of your code from GitHub. + +# Git + +> **Note** If you already did the [installation steps](../README.md), there's no need to do this again – you can skip to the next section and start creating your Git repository. + +{% include "install_git.md" %} + +## Starting our Git repository + +Git tracks changes to a particular set of files in what's called a code repository (or "repo" for short). Let's start one for our project. Open up your console and run these commands, in the `djangogirls` directory: + +> **Note** Check your current working directory with a `cd` (Windows) command before initializing the repository. You should be in the `djangogirls` folder. + +{% filename %}command-line{% endfilename %} +``` +$ git init +Initialized empty Git repository in ~/djangogirls/.git/ +$ git config --global user.name "Your Name" +$ git config --global user.email you@example.com +``` +Initializing the git repository is something we need to do only once per project (and you won't have to re-enter the username and email ever again). + +### Adjusting your branch name + +If the version of Git that you are using is older than **2.28**, you will need to change the name of your branch to "main". To determine the version of Git, please enter the following command: + +{% filename %}command-line{% endfilename %} +``` +$ git --version +git version 2.xx... +``` + +Only if the second number of the version, shown as "xx" above, is less than 28, will you need to enter the following command to rename your branch. If it is 28 or higher, please continue to "Ignoring files". As in "Initializing", this is something we need to do only once per project, as well as only when your version of Git is less than 2.28: + +{% filename %}command-line{% endfilename %} +``` +$ git branch -M main +``` + +### Ignoring files + +Git will track changes to all the files and folders in this directory, but there are some files we want it to ignore. We do this by creating a file called `.gitignore` in the base directory. Open up your editor and create a new file with the following contents: + +{% filename %}.gitignore{% endfilename %} +``` +# Python +*.pyc +*~ +__pycache__ + +# Env +.env +myvenv/ +venv/ + +# Database +db.sqlite3 + +# Static folder at project root +/static/ + +# Windows +Thumbs.db* +ehthumbs*.db +[Dd]esktop.ini +$RECYCLE.BIN/ + +# Visual Studio +.vscode/ +.history/ +*.code-workspace +``` + +And save it as `.gitignore` in the "djangogirls" folder. + +> **Note** The dot at the beginning of the file name is important! If you're having any difficulty creating it (Macs don't like you to create files that begin with a dot via the Finder, for example), then use the "Save As" feature in your editor; it's bulletproof. And be sure not to add `.txt`, `.py`, or any other extension to the file name -- it will only be recognized by Git if the name is just `.gitignore`. Linux and MacOS treat files with a name that starts with `.` (such as `.gitignore`) as hidden and the normal `ls` command won't show these files. Instead use `ls -a` to see the `.gitignore` file. + +> **Note** One of the files you specified in your `.gitignore` file is `db.sqlite3`. That file is your local database, where all of your users and posts are stored. We'll follow standard web programming practice, meaning that we'll use separate databases for your local testing site and your live website on PythonAnywhere. The PythonAnywhere database could be SQLite, like your development machine, but usually you will use one called MySQL which can deal with a lot more site visitors than SQLite. Either way, by ignoring your SQLite database for the GitHub copy, it means that all of the posts and superuser you created so far are going to only be available locally, and you'll have to create new ones on production. You should think of your local database as a good playground where you can test different things and not be afraid that you're going to delete your real posts from your blog. + +It's a good idea to use a `git status` command before `git add` or whenever you find yourself unsure of what has changed. This will help prevent any surprises from happening, such as wrong files being added or committed. The `git status` command returns information about any untracked/modified/staged files, the branch status, and much more. The output should be similar to the following: + + +{% filename %}command-line{% endfilename %} +``` +$ git status +On branch main + +No commits yet + +Untracked files: + (use "git add ..." to include in what will be committed) + + .gitignore + blog/ + manage.py + mysite/ + requirements.txt + +nothing added to commit but untracked files present (use "git add" to track) +``` + +And finally we save our changes. Go to your console and run these commands: + +{% filename %}command-line{% endfilename %} +``` +$ git add . +$ git commit -m "My Django Girls app, first commit" + [...] + 13 files changed, 200 insertions(+) + create mode 100644 .gitignore + [...] + create mode 100644 mysite/wsgi.py +``` + + +## Pushing your code to GitHub + +Go to [GitHub.com](https://www.github.com) and sign up for a new, free user account. (If you already did that in the workshop prep, that is great!) Be sure to remember your password (add it to your password manager, if you use one). + +Then, create a new repository, giving it the name "my-first-blog". Leave the "initialize with a README" checkbox unchecked, leave the .gitignore option blank (we've done that manually) and leave the License as None. + +![](images/new_github_repo.png) + +> **Note** The name `my-first-blog` is important – you could choose something else, but it's going to occur lots of times in the instructions below, and you'd have to substitute it each time. It's probably easier to stick with the name `my-first-blog`. + +On the next screen, you'll be shown your repo's clone URL, which you will use in some of the commands that follow: + +![](images/github_get_repo_url_screenshot.png) + +Now we need to hook up the Git repository on your computer to the one up on GitHub. + +Type the following into your console (replace `` with the username you entered when you created your GitHub account, but without the angle-brackets -- the URL should match the clone URL you just saw). + +{% filename %}command-line{% endfilename %} +``` +$ git remote add origin https://github.com//my-first-blog.git +$ git push -u origin main +``` + +When you push to GitHub, you'll be asked for your GitHub username and password (either right there in the command-line window or in a pop-up window), and after entering credentials you should see something like this: + +{% filename %}command-line{% endfilename %} +``` +Counting objects: 6, done. +Writing objects: 100% (6/6), 200 bytes | 0 bytes/s, done. +Total 3 (delta 0), reused 0 (delta 0) +To https://github.com/ola/my-first-blog.git + * [new branch] main -> main +Branch main set up to track remote branch main from origin. +``` + + + +Your code is now on GitHub. Go and check it out! You'll find it's in fine company – [Django](https://github.com/django/django), the [Django Girls Tutorial](https://github.com/DjangoGirls/tutorial), and many other great open source software projects also host their code on GitHub. :) + +{% include "/deploy/pythonanywhere.md" %} + +# Check out your site! + +The default page for your site should say "It worked!", just like it does on your local computer. Try adding `/admin/` to the end of the URL, and you'll be taken to the admin site. Log in with the username and password, and you'll see you can add new Posts on the server -- remember, the posts from your local test database were not sent to your live blog. + +Once you have a few posts created, you can go back to your local setup (not PythonAnywhere). From here you should work on your local setup to make changes. This is a common workflow in web development – make changes locally, push those changes to GitHub, and pull your changes down to your live Web server. This allows you to work and experiment without breaking your live Web site. Pretty cool, huh? + + +Give yourself a *HUGE* pat on the back! Server deployments are one of the trickiest parts of web development and it often takes people several days before they get them working. But you've got your site live, on the real Internet! diff --git a/en/windows/deploy/images/github_get_repo_url_screenshot.png b/en/windows/deploy/images/github_get_repo_url_screenshot.png new file mode 100644 index 00000000000..ee1560b1e85 Binary files /dev/null and b/en/windows/deploy/images/github_get_repo_url_screenshot.png differ diff --git a/en/windows/deploy/images/new_github_repo.png b/en/windows/deploy/images/new_github_repo.png new file mode 100644 index 00000000000..d1f82e5d863 Binary files /dev/null and b/en/windows/deploy/images/new_github_repo.png differ diff --git a/en/windows/deploy/images/pythonanywhere_account.png b/en/windows/deploy/images/pythonanywhere_account.png new file mode 100644 index 00000000000..612d4528e11 Binary files /dev/null and b/en/windows/deploy/images/pythonanywhere_account.png differ diff --git a/en/windows/deploy/images/pythonanywhere_bash_console.png b/en/windows/deploy/images/pythonanywhere_bash_console.png new file mode 100644 index 00000000000..68eb2a030e1 Binary files /dev/null and b/en/windows/deploy/images/pythonanywhere_bash_console.png differ diff --git a/en/windows/deploy/images/pythonanywhere_beginner_account_button.png b/en/windows/deploy/images/pythonanywhere_beginner_account_button.png new file mode 100644 index 00000000000..c1be0a14132 Binary files /dev/null and b/en/windows/deploy/images/pythonanywhere_beginner_account_button.png differ diff --git a/en/windows/deploy/images/pythonanywhere_create_api_token.png b/en/windows/deploy/images/pythonanywhere_create_api_token.png new file mode 100644 index 00000000000..abae45ae37a Binary files /dev/null and b/en/windows/deploy/images/pythonanywhere_create_api_token.png differ diff --git a/en/windows/deploy/install_git.md b/en/windows/deploy/install_git.md new file mode 100644 index 00000000000..da853b32725 --- /dev/null +++ b/en/windows/deploy/install_git.md @@ -0,0 +1,9 @@ +Git is a "version control system" used by a lot of programmers. This software can track changes to files over time so that you can recall specific versions later. A bit like the "track changes" feature in word processor programs (e.g., Microsoft Word or LibreOffice Writer), but much more powerful. + +## Installing Git + +You can download Git from [git-scm.com](https://git-scm.com/). You can hit "next" on all steps except for two: in the step where it asks to choose your editor, you should pick Nano, and in the step entitled "Adjusting your PATH environment", choose "Use Git and optional Unix tools from the Windows Command Prompt" (the bottom option). Other than that, the defaults are fine. Checkout Windows-style, commit Unix-style line endings is good. + +During installation, if you are presented with the option of "Adjusting the name of the initial branch in new repositories", please choose to "Override the default" and use "main". This will align your installation of Git with the broad direction of the global developer community, and the "main" branch will be used through the remainder of this tutorial. Please see https://sfconservancy.org/news/2020/jun/23/gitbranchname/ and https://github.com/github/renaming for further discussion of this subject. + +Do not forget to restart the command prompt or PowerShell after the installation finished successfully. diff --git a/en/windows/django_installation/README.md b/en/windows/django_installation/README.md new file mode 100644 index 00000000000..f99113eb36b --- /dev/null +++ b/en/windows/django_installation/README.md @@ -0,0 +1,5 @@ +# Django installation + +> **Note** If you already worked through the installation steps then you've already done this – you can go straight to the next chapter! + +{% include "instructions.md" %} diff --git a/en/django_installation/instructions.md b/en/windows/django_installation/instructions.md similarity index 53% rename from en/django_installation/instructions.md rename to en/windows/django_installation/instructions.md index 91ad29f6360..287e6c2fb2d 100644 --- a/en/django_installation/instructions.md +++ b/en/windows/django_installation/instructions.md @@ -1,9 +1,6 @@ > Part of this section is based on tutorials by Geek Girls Carrots (https://github.com/ggcarrots/django-carrots). -> Part of this section is based on the [django-marcador -tutorial](http://django-marcador.keimlink.de/) licensed under the Creative Commons -Attribution-ShareAlike 4.0 International License. The django-marcador tutorial -is copyrighted by Markus Zapke-Gründemann et al. +> Part of this section is based on the [django-marcador tutorial](http://django-marcador.keimlink.de/) licensed under the Creative Commons Attribution-ShareAlike 4.0 International License. The django-marcador tutorial is copyrighted by Markus Zapke-Gründemann et al. ## Virtual environment @@ -20,20 +17,17 @@ For this tutorial we will be using a new directory `djangogirls` from your home {% filename %}command-line{% endfilename %} ``` -$ mkdir djangogirls -$ cd djangogirls +C:\Users\Name> mkdir djangogirls +C:\Users\Name> cd djangogirls ``` We will make a virtualenv called `myvenv`. The general command will be in the format: {% filename %}command-line{% endfilename %} ``` -$ python3 -m venv myvenv +> python3 -m venv myvenv ``` - - To create a new `virtualenv`, you need to open the command prompt and run `python -m venv myvenv`. It will look like this: {% filename %}command-line{% endfilename %} @@ -43,75 +37,10 @@ C:\Users\Name\djangogirls> python -m venv myvenv Where `myvenv` is the name of your `virtualenv`. You can use any other name, but stick to lowercase and use no spaces, accents or special characters. It is also a good idea to keep the name short – you'll be referencing it a lot! - - - - -We can create a `virtualenv` on both Linux and OS X by running `python3 -m venv myvenv`. -It will look like this: - -{% filename %}command-line{% endfilename %} -``` -$ python3 -m venv myvenv -``` - -`myvenv` is the name of your `virtualenv`. You can use any other name, but stick to lowercase and use no spaces. It is also a good idea to keep the name short as you'll be referencing it a lot! - -> __NOTE:__ On some versions of Debian/Ubuntu you may receive the following error: - ->{% filename %}command-line{% endfilename %} ->``` ->The virtual environment was not created successfully because ensurepip is not available. On Debian/Ubuntu systems, you need to install the python3-venv package using the following command. -> apt install python3-venv ->You may need to use sudo with that command. After installing the python3-venv package, recreate your virtual environment. ->``` -> -> In this case, follow the instructions above and install the `python3-venv` package: ->{% filename %}command-line{% endfilename %} ->``` ->$ sudo apt install python3-venv ->``` - -> __NOTE:__ On some versions of Debian/Ubuntu initiating the virtual environment like this currently gives the following error: - ->{% filename %}command-line{% endfilename %} ->``` ->Error: Command '['/home/eddie/Slask/tmp/venv/bin/python3', '-Im', 'ensurepip', '--upgrade', '--default-pip']' returned non-zero exit status 1 ->``` - -> To get around this, use the `virtualenv` command instead. - ->{% filename %}command-line{% endfilename %} ->``` ->$ sudo apt install python-virtualenv ->$ virtualenv --python=python{{ book.py_version }} myvenv ->``` - -> __NOTE:__ If you get an error like - ->{% filename %}command-line{% endfilename %} ->``` ->E: Unable to locate package python3-venv ->``` - -> then instead run: -> ->{% filename %}command-line{% endfilename %} ->``` ->sudo apt install python{{ book.py_version }}-venv ->``` - - - - ## Working with virtualenv The command above will create a directory called `myvenv` (or whatever name you chose) that contains our virtual environment (basically a bunch of directories and files). - - Start your virtual environment by running: {% filename %}command-line{% endfilename %} @@ -119,13 +48,17 @@ Start your virtual environment by running: C:\Users\Name\djangogirls> myvenv\Scripts\activate ``` -> __NOTE:__ On Windows 10 you might get an error in the Windows PowerShell that says `execution of scripts is disabled on this system`. In this case, open another Windows PowerShell with the "Run as Administrator" option. Then try typing the following command before starting your virtual environment: -> +> __NOTE:__ On Windows 10 you might get an error in the Windows PowerShell that says `execution of scripts is disabled on this system`. In this case, open another Windows PowerShell with the "Run as Administrator" option. Then try typing the following command before starting your virtual environment: + >{% filename %}command-line{% endfilename %} >``` >C:\WINDOWS\system32> Set-ExecutionPolicy -ExecutionPolicy RemoteSigned -> Execution Policy Change -> The execution policy helps protect you from scripts that you do not trust. Changing the execution policy might expose you to the security risks described in the about_Execution_Policies help topic at http://go.microsoft.com/fwlink/?LinkID=135170. Do you want to change the execution policy? [Y] Yes [A] Yes to All [N] No [L] No to All [S] Suspend [?] Help (default is "N"): A +> Execution Policy Change +> The execution policy helps protect you from scripts that you do not trust. +Changing the execution policy might expose you to the security risks described +in the about_Execution_Policies help topic at http://go.microsoft.com/fwlink/?LinkID=135170. +Do you want to change the execution policy? +[Y] Yes [A] Yes to All [N] No [L] No to All [S] Suspend [?] Help (default is "N"): A >``` @@ -135,30 +68,7 @@ C:\Users\Name\djangogirls> myvenv\Scripts\activate >``` >$ . myvenv\Scripts\activate.ps1 >``` ->The advantage is that you don't have to switch between editor windows and command-line windows - - - - - -Start your virtual environment by running: - -{% filename %}command-line{% endfilename %} -``` -$ source myvenv/bin/activate -``` - -Remember to replace `myvenv` with your chosen `virtualenv` name! - -> __NOTE:__ If the command `source` is not available, try doing this instead: -> ->{% filename %}command-line{% endfilename %} ->``` ->$ . myvenv/bin/activate ->``` - - +>The advantage is that you don't have to switch between editor windows and command-line windows. You will know that you have `virtualenv` started when you see that the prompt in your console is prefixed with `(myvenv)`. @@ -179,15 +89,14 @@ Before we do that, we should make sure we have the latest version of `pip`, the ### Installing packages with requirements -A requirements file keeps a list of dependencies to be installed using -`pip install`: +A requirements file keeps a list of dependencies to be installed using `pip install`: First create a `requirements.txt` file inside of the `djangogirls/` folder, using the code editor that you installed earlier. You do this by opening a new file in the code editor and then saving it as `requirements.txt` in the `djangogirls/` folder. Your directory will look like this: ``` djangogirls ├── myvenv -│ └── ... +│ └── ... └───requirements.txt ``` @@ -204,35 +113,11 @@ Now, run `pip install -r requirements.txt` to install Django. ``` (myvenv) ~$ pip install -r requirements.txt Collecting Django~={{ book.django_version }} (from -r requirements.txt (line 1)) - Downloading Django-{{ book.django_version }}-py3-none-any.whl (7.9MB) + Downloading Django-{{ book.django_version }}-py3-none-any.whl (7.9MB) Installing collected packages: Django Successfully installed Django-{{ book.django_version }} ``` - - > If you get an error when calling pip on Windows, please check if your project pathname contains spaces, accents or special characters (for example, `C:\Users\User Name\djangogirls`). If it does, please consider using another place without spaces, accents or special characters (suggestion: `C:\djangogirls`). Create a new virtualenv in the new directory, then delete the old one and try the above command again. (Moving the virtualenv directory won't work since virtualenv uses absolute paths.) - - - - -> Your command line might freeze when you try to install Django. If this happens, instead of the above command use: -> ->{% filename %}command-line{% endfilename %} ->``` ->C:\Users\Name\djangogirls> python -m pip install -r requirements.txt ->``` - - - - - -> If you get an error when calling pip on Ubuntu 12.04 please run `python -m pip install -U --force-reinstall pip` to fix the pip installation in the virtualenv. - - - That's it! You're now (finally) ready to create a Django application! diff --git a/en/windows/django_start_project/README.md b/en/windows/django_start_project/README.md new file mode 100644 index 00000000000..624c5dba69e --- /dev/null +++ b/en/windows/django_start_project/README.md @@ -0,0 +1,169 @@ +# Your first Django project! + +> Part of this chapter is based on tutorials by Geek Girls Carrots (https://github.com/ggcarrots/django-carrots). + +> Parts of this chapter are based on the [django-marcador +tutorial](http://django-marcador.keimlink.de/) licensed under the Creative Commons +Attribution-ShareAlike 4.0 International License. The django-marcador tutorial +is copyrighted by Markus Zapke-Gründemann et al. + +We're going to create a small blog! + +The first step is to start a new Django project. Basically, this means that we'll run some scripts provided by Django that will create the skeleton of a Django project for us. This is just a bunch of directories and files that we will use later. + +The names of some files and directories are very important for Django. You should not rename the files that we are about to create. Moving them to a different place is also not a good idea. Django needs to maintain a certain structure to be able to find important things. + +> Remember to run everything in the virtualenv. If you don't see a prefix `(myvenv)` in your console, you need to activate your virtualenv. We explained how to do that in the __Django installation__ chapter in the __Working with virtualenv__ part. Typing `source myvenv/bin/activate` on Mac OS X or Linux will do this for you. + +In your Mac OS X or Linux console, you should run the following command. **Don't forget to add the period (or dot) `.` at the end!** + +{% filename %}command-line{% endfilename %} +``` +(myvenv) ~/djangogirls$ django-admin startproject mysite . +``` + +> The period `.` is crucial because it tells the script to install Django in your current directory (for which the period `.` is a short-hand reference). + +> **Note** When typing the command above, remember that you only type the part which starts by `django-admin`. +The `(myvenv) ~/djangogirls$` part shown here is just example of the prompt that will be inviting your input on your command line. + +`django-admin.py` is a script that will create the directories and files for you. You should now have a directory structure which looks like this: + +``` +djangogirls +├── manage.py +├── mysite +│   ├── asgi.py +│   ├── __init__.py +│   ├── settings.py +│   ├── urls.py +│   └── wsgi.py +├── myvenv +│   └── ... +└── requirements.txt +``` +> **Note**: in your directory structure, you will also see your `myvenv` directory that we created before. + +`manage.py` is a script that helps with management of the site. With it we will be able (amongst other things) to start a web server on our computer without installing anything else. + +The `settings.py` file contains the configuration of your website. + +Remember when we talked about a mail carrier checking where to deliver a letter? `urls.py` file contains a list of patterns used by `urlresolver`. + +Let's ignore the other files for now as we won't change them. The only thing to remember is not to delete them by accident! + + +## Changing settings + +Let's make some changes in `mysite/settings.py`. Open the file using the code editor you installed earlier. + +**Note**: Keep in mind that `settings.py` is a regular file, like any other. You can open it from inside the code editor, using the "file -> open" menu actions. This should get you the usual window in which you can navigate to your `settings.py` file and select it. Alternatively, you can open the file by navigating to the djangogirls folder on your desktop and right-clicking on it. Then, select your code editor from the list. Selecting the editor is important as you might have other programs installed that can open the file but will not let you edit it. + +It would be nice to have the correct time on our website. Go to [Wikipedia's list of time zones](https://en.wikipedia.org/wiki/List_of_tz_database_time_zones) and copy your relevant time zone (TZ) (e.g. `Europe/Berlin`). + +In `settings.py`, find the line that contains `TIME_ZONE` and modify it to choose your own timezone. For example: + +{% filename %}mysite/settings.py{% endfilename %} +```python +TIME_ZONE = 'Europe/Berlin' +``` + +A language code consist of the language, e.g. `en` for English or `de` for German, and the country code, e.g. `de` for Germany or `ch` for Switzerland. If English is not your native language, you can add this to change the default buttons and notifications from Django to be in your language. So you would have "Cancel" button translated into the language you defined here. [Django comes with a lot of prepared translations](https://docs.djangoproject.com/en/3.2/ref/settings/#language-code). + +If you want a different language, change the language code by changing the following line: + +{% filename %}mysite/settings.py{% endfilename %} +```python +LANGUAGE_CODE = 'de-ch' +``` + + +We'll also need to add a path for static files. (We'll find out all about static files and CSS later in the tutorial.) Go down to the *end* of the file, and just underneath the `STATIC_URL` entry, add a new one called `STATIC_ROOT`: + +{% filename %}mysite/settings.py{% endfilename %} +```python +STATIC_URL = '/static/' +STATIC_ROOT = BASE_DIR / 'static' +``` + +When `DEBUG` is `True` and `ALLOWED_HOSTS` is empty, the host is validated against `['localhost', '127.0.0.1', '[::1]']`. This won't +match our hostname on PythonAnywhere once we deploy our application so we will change the following setting: + +{% filename %}mysite/settings.py{% endfilename %} +```python +ALLOWED_HOSTS = ['127.0.0.1', '.pythonanywhere.com'] +``` + +## Set up a database + +There's a lot of different database software that can store data for your site. We'll use the default one, `sqlite3`. + +This is already set up in this part of your `mysite/settings.py` file: + +{% filename %}mysite/settings.py{% endfilename %} +```python +DATABASES = { + 'default': { + 'ENGINE': 'django.db.backends.sqlite3', + 'NAME': BASE_DIR / 'db.sqlite3', + } +} +``` + +To create a database for our blog, let's run the following in the console: `python manage.py migrate` (we need to be in the `djangogirls` directory that contains the `manage.py` file). If that goes well, you should see something like this: + +{% filename %}command-line{% endfilename %} +``` +(myvenv) ~/djangogirls$ python manage.py migrate +Operations to perform: + Apply all migrations: admin, auth, contenttypes, sessions +Running migrations: + Applying contenttypes.0001_initial... OK + Applying auth.0001_initial... OK + Applying admin.0001_initial... OK + Applying admin.0002_logentry_remove_auto_add... OK + Applying admin.0003_logentry_add_action_flag_choices... OK + Applying contenttypes.0002_remove_content_type_name... OK + Applying auth.0002_alter_permission_name_max_length... OK + Applying auth.0003_alter_user_email_max_length... OK + Applying auth.0004_alter_user_username_opts... OK + Applying auth.0005_alter_user_last_login_null... OK + Applying auth.0006_require_contenttypes_0002... OK + Applying auth.0007_alter_validators_add_error_messages... OK + Applying auth.0008_alter_user_username_max_length... OK + Applying auth.0009_alter_user_last_name_max_length... OK + Applying auth.0010_alter_group_name_max_length... OK + Applying auth.0011_update_proxy_permissions... OK + Applying auth.0012_alter_user_first_name_max_length... OK + Applying sessions.0001_initial... OK +``` + +And we're done! Time to start the web server and see if our website is working! + +## Starting the web server + +You need to be in the directory that contains the `manage.py` file (the `djangogirls` directory). In the console, we can start the web server by running `python manage.py runserver`: + +{% filename %}command-line{% endfilename %} +``` +(myvenv) ~/djangogirls$ python manage.py runserver +``` + +Now you need to check that your website is running. Open your browser (Firefox, Chrome, Safari, Internet Explorer or whatever you use) and enter this address: + +{% filename %}browser{% endfilename %} +``` +http://127.0.0.1:8000/ +``` + +Congratulations! You've just created your first website and run it using a web server! Isn't that awesome? + +![Install worked!](images/install_worked.png) + +Note that a command window can only run one thing at a time, and the command window you opened earlier is running the web server. As long as the web server is running and waiting for additional incoming requests, the terminal will accept new text but will not execute new commands. + +> We reviewed how web servers work in the How the Internet works chapter. + +To type additional commands while the web server is running, open a new terminal window and activate your virtualenv -- to review instructions on how to open a second terminal window, see [Introduction to the command line](../intro_to_command_line/README.md). To stop the web server, switch back to the window in which it's running and press CTRL+C - Control and C keys together (on Windows, you might have to press Ctrl+Break). + +Ready for the next step? It's time to create some content! diff --git a/en/windows/django_start_project/images/install_worked.png b/en/windows/django_start_project/images/install_worked.png new file mode 100644 index 00000000000..4354c634ddb Binary files /dev/null and b/en/windows/django_start_project/images/install_worked.png differ diff --git a/en/windows/intro_to_command_line/README.md b/en/windows/intro_to_command_line/README.md new file mode 100644 index 00000000000..87e911066cd --- /dev/null +++ b/en/windows/intro_to_command_line/README.md @@ -0,0 +1,252 @@ +# Introduction to the command-line interface + +> For readers at home: this chapter is covered in the [Your new friend: Command Line](https://www.youtube.com/watch?v=jvZLWhkzX-8) video. + +It's exciting, right?! You'll write your first line of code in just a few minutes! :) + +__Let us introduce you to your first new friend: the command line!__ + +The following steps will show you how to use the black window all hackers use. It might look a bit scary at first but really it's just a prompt waiting for commands from you. + +> **Note** Please note that throughout this book we use the terms 'directory' and 'folder' interchangeably but they are one and the same thing. + +## What is the command line? + +The window, which is usually called the __command line__ or __command-line interface__, is a text-based application for viewing, handling, and manipulating files on your computer. It's much like Windows Explorer or Finder on the Mac, but without the graphical interface. Other names for the command line are: *cmd*, *CLI*, *prompt*, *console* or *terminal*. + +## Open the command-line interface + +To start some experiments we need to open our command-line interface first. + +Depending on your version of Windows and your keyboard, one of the following should open a command window (you may have to experiment a bit, but you don't have to try all of these suggestions): + +- Go to the Start menu or screen, and enter "Command Prompt" in the search field. +- Go to Start menu → Windows System → Command Prompt. +- Go to Start menu → All Programs → Accessories → Command Prompt. +- Go to the Start screen, hover your mouse in the lower-left corner of the + screen, and click the down arrow that appears (on a touch screen, instead flick + up from the bottom of the screen). + The Apps page should open. + Click on Command Prompt in the Windows System section. +- Hold the special Windows key on your keyboard and press the "X" key. + Choose "Command Prompt" from the pop-up menu. +- Hold the Windows key and press the "R" key to get a "Run" window. + Type "cmd" in the box, and click the OK key. + +![Type "cmd" in the "Run" window](python_installation/images/windows-plus-r.png) + +Later in this tutorial, you will need to have two command windows open at the same time. However, on some versions of Windows, if you already have one command window open and you try to open a second one using the same method, it will instead point you to the command window you already have open. Try it now on your computer and see what happens! If you only get one command window, try one of the other methods in the list above. At least one of them should result in a new command window being opened. + + +## Prompt + +You now should see a white or black window that is waiting for your commands. + +On Windows, you will probably see a `>`, like this: + +{% filename %}command-line{% endfilename %} +``` +> +``` + +Take a look at the Linux section just above now -- you'll see something more like that when you get to PythonAnywhere later in the tutorial. + +Each command will be prepended by a `>` and one space, but you should not type it. Your computer will do it for you. :) + +> Just a small note: in your case there may be something like `C:\Users\ola>` before the prompt sign, and this is 100% OK. + +The part up to and including the `>` is called the *command line prompt*, or *prompt* for short. It prompts you to input something there. + +In the tutorial, when we want you to type in a command, we will include the `$` or `>`, and occasionally more to the left. Ignore the left part and only type in the command, which starts after the prompt. + +## Your first command (YAY!) + +Let's start by typing this command: + +{% filename %}command-line{% endfilename %} +``` +> whoami +``` + +And then hit `enter`. This is our result: + +{% filename %}command-line{% endfilename %} +``` +> whoami +olasitarska +``` + +As you can see, the computer has just printed your username. Neat, huh? :) + +> Try to type each command; do not copy-paste. You'll remember more this way! + +## Basics + +Each operating system has a slightly different set of commands for the command line, so make sure to follow instructions for your operating system. Let's try this, shall we? + +### Current directory + +It'd be nice to know where are we now, right? Let's see. Type this command and hit `enter`: + +{% filename %}command-line{% endfilename %} +``` +> cd +C:\Users\olasitarska +``` +> Note: 'cd' stands for 'change directory'. With PowerShell you can use pwd just like on Linux or Mac OS X. + +You'll probably see something similar on your machine. Once you open the command line you usually start at your user's home directory. + +--- + +### Learn more about a command + +Many commands you can type at the command prompt have built-in help that you can display and read! For example, to learn more about the current directory command: + +Adding a `/?` suffix to most commands will print the help page. You may need to scroll your command window up to see it all. Try `cd /?`. + +### List files and directories + +So what's in it? It'd be cool to find out. Let's see: + +{% filename %}command-line{% endfilename %} +``` +> dir + Directory of C:\Users\olasitarska +05/08/2020 07:28 PM Applications +05/08/2020 07:28 PM Desktop +05/08/2020 07:28 PM Downloads +05/08/2020 07:28 PM Music +... +``` +> Note: In PowerShell you can also use 'ls' like on Linux and Mac OS X. + +--- + +### Change current directory + +{% filename %}command-line{% endfilename %} +``` +> cd Desktop +``` + +Check if it's really changed: + +{% filename %}command-line{% endfilename %} +``` +> cd +C:\Users\olasitarska\Desktop +``` + +Here it is! + +> PRO tip: if you type `cd D` and then hit `tab` on your keyboard, the command line will automatically fill in the rest of the name so you can navigate faster. If there is more than one folder starting with "D", hit the `tab` key twice to get a list of options. + +--- + +### Create directory + +How about creating a practice directory on your desktop? You can do it this way: + +{% filename %}command-line{% endfilename %} +``` +> mkdir practice +``` + +This little command will create a folder with the name `practice` on your desktop. You can check if it's there by looking on your Desktop or by running a `ls` or `dir` command! Try it. :) + +> PRO tip: If you don't want to type the same commands over and over, try pressing the `up arrow` and `down arrow` on your keyboard to cycle through recently used commands. + +--- + +### Exercise! + +A small challenge for you: in your newly created `practice` directory, create a directory called `test`. (Use the `cd` and `mkdir` commands.) + +#### Solution: + +{% filename %}command-line{% endfilename %} +``` +> cd practice +> mkdir test +> dir +05/08/2020 07:28 PM test +``` + +Congrats! :) + +--- + +### Clean up + +We don't want to leave a mess, so let's remove everything we did until that point. + +First, we need to get back to Desktop: + +{% filename %}command-line{% endfilename %} +``` +> cd .. +``` + +Using `..` with the `cd` command will change your current directory to the parent directory (that is, the directory that contains your current directory). + +Check where you are: + +{% filename %}command-line{% endfilename %} +``` +> cd +C:\Users\olasitarska\Desktop +``` + +Now time to delete the `practice` directory: + +> __Attention__: Deleting files using `del`, `rmdir` or `rm` is irrecoverable, meaning _the deleted files will be gone forever_! So be very careful with this command. + +{% filename %}command-line{% endfilename %} +``` +> rmdir /S practice +practice, Are you sure ? Y +``` + +Done! To be sure it's actually deleted, let's check it: + +{% filename %}command-line{% endfilename %} +``` +> dir +``` + +### Exit + +That's it for now! You can safely close the command line now. Let's do it the hacker way, alright? :) + +{% filename %}command-line{% endfilename %} +``` +> exit +``` + +Cool, huh? :) + +## Summary + + Here is a summary of some useful commands: + +Command (Windows) | Command (Mac OS / Linux) | Description | Example +----------------- | ------------------------ | -------------------------- | --------------------------------------------- +exit | exit | close the window | **exit** +cd | cd | change directory | **cd test** +cd | pwd | show the current directory | **cd** (Windows) or **pwd** (Mac OS / Linux) +dir | ls | list directories/files | **dir** +copy | cp | copy file | **copy c:\test\test.txt c:\windows\test.txt** +move | mv | move file | **move c:\test\test.txt c:\windows\test.txt** +mkdir | mkdir | create a new directory | **mkdir testdirectory** +rmdir (or del) | rm | delete a file | **del c:\test\test.txt** +rmdir /S | rm -r | delete a directory | **rm -r testdirectory** +[CMD] /? | man [CMD] | get help for a command | **cd /?** (Windows) or **man cd** (Mac OS / Linux) + +These are just a very few of the commands you can run in your command line, but you're not going to use anything more than that today. + +If you're curious, [ss64.com](http://ss64.com) contains a complete reference of commands for all operating systems. + +## Ready? + +Let's dive into Python! diff --git a/en/windows/intro_to_command_line/open_instructions.md b/en/windows/intro_to_command_line/open_instructions.md new file mode 100644 index 00000000000..073a7d4db3d --- /dev/null +++ b/en/windows/intro_to_command_line/open_instructions.md @@ -0,0 +1,22 @@ +## Open the command-line interface + +To start some experiments we need to open our command-line interface first. + +Depending on your version of Windows and your keyboard, one of the following should open a command window (you may have to experiment a bit, but you don't have to try all of these suggestions): + +- Go to the Start menu or screen, and enter "Command Prompt" in the search field. +- Go to Start menu → Windows System → Command Prompt. +- Go to Start menu → All Programs → Accessories → Command Prompt. +- Go to the Start screen, hover your mouse in the lower-left corner of the + screen, and click the down arrow that appears (on a touch screen, instead flick + up from the bottom of the screen). + The Apps page should open. + Click on Command Prompt in the Windows System section. +- Hold the special Windows key on your keyboard and press the "X" key. + Choose "Command Prompt" from the pop-up menu. +- Hold the Windows key and press the "R" key to get a "Run" window. + Type "cmd" in the box, and click the OK key. + +![Type "cmd" in the "Run" window](python_installation/images/windows-plus-r.png) + +Later in this tutorial, you will need to have two command windows open at the same time. However, on some versions of Windows, if you already have one command window open and you try to open a second one using the same method, it will instead point you to the command window you already have open. Try it now on your computer and see what happens! If you only get one command window, try one of the other methods in the list above. At least one of them should result in a new command window being opened. diff --git a/en/windows/python_installation/README.md b/en/windows/python_installation/README.md new file mode 100644 index 00000000000..dfb91af39e3 --- /dev/null +++ b/en/windows/python_installation/README.md @@ -0,0 +1,6 @@ +# Python installation + +> **Note** If you already worked through the installation steps, there's no need to do this again – you can skip straight ahead to the next chapter! + +{% include "instructions.md" %} + diff --git a/en/windows/python_installation/images/python-installation-options.png b/en/windows/python_installation/images/python-installation-options.png new file mode 100644 index 00000000000..a0a6c65d81d Binary files /dev/null and b/en/windows/python_installation/images/python-installation-options.png differ diff --git a/en/windows/python_installation/images/windows-plus-r.png b/en/windows/python_installation/images/windows-plus-r.png new file mode 100644 index 00000000000..4f8f7433381 Binary files /dev/null and b/en/windows/python_installation/images/windows-plus-r.png differ diff --git a/en/windows/python_installation/instructions.md b/en/windows/python_installation/instructions.md new file mode 100644 index 00000000000..e8135f6a246 --- /dev/null +++ b/en/windows/python_installation/instructions.md @@ -0,0 +1,40 @@ +> For readers at home: this chapter is covered in the [Installing Python & Code Editor](https://www.youtube.com/watch?v=pVTaqzKZCdA) video. + +> This section is based on a tutorial by Geek Girls Carrots (https://github.com/ggcarrots/django-carrots) + +Django is written in Python. We need Python to do anything in Django. Let's start by installing it! We want you to install the latest version of Python 3, so if you have any earlier version, you will need to upgrade it. If you already have version {{ book.py_min_version }} or higher you should be fine. + +Please install normal Python as follows, even when you have Anaconda installed on your computer. + +First check whether your computer is running a 32-bit version or a 64-bit version of Windows, on the "System type" line of the System Info page. To reach this page, try one of these methods: + +* Press the Windows key and Pause/Break key at the same time +* Open your Control Panel from the Windows menu, then navigate to System & Security, then System +* Press the Windows button, then navigate to Settings > System > About* Search the Windows Start menu for "System Information". To do that, click the Start button or press the Windows key, then begin to type `System Information`. It will start making suggestions as soon as you type. You can select the entry once it shows up. + +You can download Python for Windows from the website https://www.python.org/downloads/windows/. Click on the "Latest Python 3 Release - Python x.x.x" link. If your computer is running a **64-bit** version of Windows, download the **Windows x86-64 executable installer**. Otherwise, download the **Windows x86 executable installer**. After downloading the installer, you should run it (double-click on it) and follow the instructions there. + +One thing to watch out for: During the installation, you will notice a window marked "Setup". Make sure you tick the "Add Python {{ book.py_version }} to PATH" or "Add Python to your environment variables" checkbox and click on "Install Now", as shown here (it may look a bit different if you are installing a different version): + +![Don't forget to add Python to the Path](python_installation/images/python-installation-options.png) + +When the installation completes, you may see a dialog box with a link you can follow to learn more about Python or about the version you installed. Close or cancel that dialog -- you'll be learning more in this tutorial! + +Note: If you are using an older version of Windows (7, Vista, or any older version) and the Python {{ book.py_version }} installer fails with an error, then install all Windows Updates and try to install Python again. If you still have the error, try installing Python version {{ book.py_min_release }} from [Python.org](https://www.python.org/downloads/windows/). + +> Django {{ book.django_version }} needs Python {{ book.py_min_version }} or greater, which does not support Windows XP or earlier versions. + +Verify the installation was successful by opening a command prompt and running the `python3` command: + +{% filename %}command-line{% endfilename %} +``` +$ python3 --version +Python {{ book.py_release }} +``` +The version shown may be different from {{ book.py_release }} -- it should match the version you installed. + +**NOTE:** If you get an error message that `python3` wasn't found, try using `python` (without the `3`) and check if it still might be a version of Python that is {{ book.py_min_version }} or higher. If that doesn't work either, you may open a new command prompt and try again; this happens if you use a command prompt left open from before the Python installation. + +---- + +If you have any doubts, or if something went wrong and you have no idea what to do next, please ask your coach! Sometimes things don't go smoothly and it's better to ask for help from someone with more experience. diff --git a/en/windows/python_introduction/README.md b/en/windows/python_introduction/README.md new file mode 100644 index 00000000000..55f87596b02 --- /dev/null +++ b/en/windows/python_introduction/README.md @@ -0,0 +1,15 @@ +{% set warning_icon = '' %} + +# Introduction to Python + +> Part of this chapter is based on tutorials by Geek Girls Carrots (https://github.com/ggcarrots/django-carrots). + +Let's write some code! + +{% include "prompt.md" %} + +{% include "/python_introduction/instructions.md" %} + +{% include "instructions.md" %} + +{% include "/python_introduction/instructions_part_two.md" %} diff --git a/en/windows/python_introduction/images/cupcake.png b/en/windows/python_introduction/images/cupcake.png new file mode 100644 index 00000000000..8c1820adee8 Binary files /dev/null and b/en/windows/python_introduction/images/cupcake.png differ diff --git a/en/windows/python_introduction/instructions.md b/en/windows/python_introduction/instructions.md new file mode 100644 index 00000000000..bc2ddc48ab5 --- /dev/null +++ b/en/windows/python_introduction/instructions.md @@ -0,0 +1,24 @@ +On Windows Command Prompt, it will be like this: + +{% filename %}command-line{% endfilename %} +``` +> cd %HomePath%\Desktop +``` + +And on Windows Powershell, it will be like this: + +{% filename %}command-line{% endfilename %} +``` +> cd $Home\Desktop +``` + +If you get stuck, ask for help. That's exactly what the coaches are here for! + +Now use Python to execute the code in the file like this: + +{% filename %}command-line{% endfilename %} +```python +> python python_intro.py +``` + +Note: on Windows 'python3' is not recognized as a command. Instead, use 'python' to execute the file. diff --git a/en/python_introduction/prompt.md b/en/windows/python_introduction/prompt.md similarity index 54% rename from en/python_introduction/prompt.md rename to en/windows/python_introduction/prompt.md index 20ff92b9173..02d4901bb9d 100644 --- a/en/python_introduction/prompt.md +++ b/en/windows/python_introduction/prompt.md @@ -6,21 +6,12 @@ To start playing with Python, we need to open up a *command line* on your comput Once you're ready, follow the instructions below. -We want to open up a Python console, so type in `python` on Windows or `python3` on Mac OS/Linux and hit `enter`. +We want to open up a Python console, so type in `python` on Windows and hit `enter`. {% filename %}command-line{% endfilename %} ``` -$ python3 +> python Python {{ book.py_release }} (...) Type "help", "copyright", "credits" or "license" for more information. >>> ``` - - - -To open the Python terminal on RunCode, go to Workspaces → New Workspace → Jupyter Lab. This will open a Python prompt -which is depicted by `>>>`. If you already opened an Ubuntu terminal open, in the [Intro to Command Line](../intro_to_command_line/README.md) chapter, you can just type `python3` in the prompt as shown below to open a Python prompt. - -`ubuntu@runcode:~$ python3` - - \ No newline at end of file