Skip to content

Commit 67f09f5

Browse files
das-gdas-g
authored
Merge pull request DjangoGirls#1708 from CERN/master
Add instructions to host the tutorial project on Glitch.com
2 parents 57bba09 + b44e4ce commit 67f09f5

File tree

2 files changed

+129
-2
lines changed

2 files changed

+129
-2
lines changed

‎en/chromebook_setup/instructions.md

+87-2
Original file line numberDiff line numberDiff line change
@@ -2,15 +2,15 @@ You can [skip right over this section](http://tutorial.djangogirls.org/en/instal
22
are, your installation experience will be a little different. You can ignore the
33
rest of the installation instructions.
44

5-
### Cloud IDE (PaizaCloud Cloud IDE, AWS Cloud9)
5+
### Cloud IDE (PaizaCloud Cloud IDE, AWS Cloud9, Glitch.com)
66

77
Cloud IDE is a tool that gives you a code editor and access to a computer running
88
on the Internet where you can install, write, and run the software. For the duration
99
of the tutorial, cloud IDE will act as your _local machine_. You'll still be
1010
running commands in a terminal interface just like your classmates on OS X,
1111
Ubuntu, or Windows, but your terminal will be connected to a computer running
1212
somewhere else that cloud IDE sets up for you.
13-
Here is the instructions for cloud IDEs (PaizaCloud Cloud IDE, AWS Cloud9).
13+
Here are the instructions for cloud IDEs (PaizaCloud Cloud IDE, AWS Cloud9, Glitch.com).
1414
You can choose one of the cloud IDEs, and follow the instruction of the cloud IDE.
1515

1616
#### PaizaCloud Cloud IDE
@@ -61,6 +61,91 @@ This bottom area is your terminal. You can use the terminal to send instructions
6161
to the remote Cloud 9 computer. You can resize that window to make it a bit
6262
bigger.
6363

64+
#### Glitch.com Cloud IDE
65+
66+
1. Go to [Glitch.com](https://glitch.com/)
67+
2. Sign up for an account (https://glitch.com/signup) or use your GitHub account if you have one. (See GitHub instructions below.)
68+
3. Click _New Project_ and choose _hello-webpage_
69+
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:
70+
71+
{% filename %}Terminal{% endfilename %}
72+
```
73+
app@name-of-your-glitch-project:~
74+
```
75+
76+
When using Glitch.com as your Cloud IDE, you don't have to create a virtual environment.
77+
Instead, create the following files manually:
78+
79+
{% filename %}glitch.json{% endfilename %}
80+
```json
81+
{
82+
"install": "pip3 install -r requirements.txt --user",
83+
"start": "bash start.sh",
84+
"watch": {
85+
"throttle": 1000
86+
}
87+
}
88+
```
89+
90+
{% filename %}requirements.txt{% endfilename %}
91+
```
92+
Django~={{ book.django_version }}
93+
```
94+
95+
{% filename %}.bash_profile{% endfilename %}
96+
```bash
97+
alias python=python3
98+
alias pip=pip3
99+
```
100+
101+
102+
{% filename %}start.sh{% endfilename %}
103+
```bash
104+
chmod 600 .bash_profile
105+
pip3 install -r requirements.txt --user
106+
python3 manage.py makemigrations
107+
python3 manage.py migrate
108+
python3 manage.py runserver $PORT
109+
```
110+
111+
Once these files are created, go to the Terminal and execute the following commands to create your first Django project:
112+
113+
{% filename %}Terminal{% endfilename %}
114+
```
115+
django-admin.py startproject mysite .
116+
refresh
117+
```
118+
119+
In order to see detailed error messages, you can activate Django debug logs for your Glitch application.
120+
Simply add the following at the end of the `mysite/settings.py` file.
121+
122+
{% filename %}mysite/settings.py{% endfilename %}
123+
```python
124+
LOGGING = {
125+
'version': 1,
126+
'disable_existing_loggers': False,
127+
'handlers': {
128+
'file': {
129+
'level': 'DEBUG',
130+
'class': 'logging.FileHandler',
131+
'filename': 'debug.log',
132+
},
133+
},
134+
'loggers': {
135+
'django': {
136+
'handlers': ['file'],
137+
'level': 'DEBUG',
138+
'propagate': True,
139+
},
140+
},
141+
}
142+
```
143+
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.
144+
145+
The initial restarting of the Glitch project should fail.
146+
(If you click on the top dropdown button `Show` then click on `In a New Window`, you will receive a `DisallowedHost` error message.)
147+
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.
148+
64149
### Virtual Environment
65150

66151
A virtual environment (also called a virtualenv) is like a private box we can

‎en/django_start_project/README.md

+42
Original file line numberDiff line numberDiff line change
@@ -118,6 +118,37 @@ ALLOWED_HOSTS = ['127.0.0.1', '.pythonanywhere.com']
118118
119119
> Also add `.amazonaws.com` to the `ALLOWED_HOSTS` if you are using cloud9
120120
121+
> If you are hosting your project on `Glitch.com`, let us protect the Django secret key that needs to
122+
> remain confidential (otherwise, anyone remixing your project could see it):
123+
> * First, we are going to create a random secret key.
124+
> Open the Glitch terminal again, and type the following command:
125+
> {% filename %}.env{% endfilename %}
126+
> ```bash
127+
> python -c 'from django.core.management.utils import get_random_secret_key; \
128+
> print(get_random_secret_key())'
129+
> ```
130+
> This should display a long random string, perfect to use as a secret key for your brand new Django web site.
131+
> 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.
132+
>
133+
> * Create a file `.env` at the root of your project and add the following property in it:
134+
> {% filename %}.env{% endfilename %}
135+
> ```bash
136+
> # Here, inside the single quotes, you can cut and paste the random key generated above
137+
> SECRET='3!0k#7ds5mp^-x$lqs2%le6v97h#@xopab&oj5y7d=hxe511jl'
138+
> ```
139+
> * Then update the Django settings file to inject this secret value and set the Django web site name:
140+
> {% filename %}mysite/settings.py{% endfilename %}
141+
> ```python
142+
> SECRET_KEY = os.getenv('SECRET')
143+
> ```
144+
> * And a little further, in the same file, we inject the name of your new Glitch website:
145+
> {% filename %}mysite/settings.py{% endfilename %}
146+
> ```python
147+
> ALLOWED_HOSTS = [os.getenv('PROJECT_DOMAIN') + ".glitch.me"]
148+
> ```
149+
> The `PROJECT_DOMAIN` value is automatically generated by Glitch.
150+
> It will correspond to the name of your project.
151+
121152
## Set up a database
122153
123154
There's a lot of different database software that can store data for your site. We'll use the default one, `sqlite3`.
@@ -175,6 +206,13 @@ If you are on a Chromebook, use this command instead:
175206
{% filename %}Cloud 9{% endfilename %}
176207
```
177208
(myvenv) ~/djangogirls$ python manage.py runserver 0.0.0.0:8080
209+
```
210+
or this one if you are using Glitch:
211+
212+
{% filename %}Glitch.com terminal{% endfilename %}
213+
```
214+
$ refresh
215+
178216
```
179217
180218
If you are on Windows and this fails with `UnicodeDecodeError`, use this command instead:
@@ -198,6 +236,10 @@ If you're using a Chromebook and Cloud9, instead click the URL in the pop-up win
198236
```
199237
https://<a bunch of letters and numbers>.vfs.cloud9.us-west-2.amazonaws.com
200238
```
239+
or on Glitch:
240+
```
241+
https://name-of-your-glitch-project.glitch.me
242+
```
201243
202244
Congratulations! You've just created your first website and run it using a web server! Isn't that awesome?
203245

0 commit comments

Comments
 (0)