スポンサーリンク

DjangoGirlsTutorialをやってみる(5)urlとview

前回は、Herokuにデプロイするところまで行った。

DjangoGirlsTutorialをやってみる(4)Herokuにデプロイ

今回は、https://djangogirlsjapan.gitbooks.io/workshop_tutorialjp/content/django_urls/ をtryしてみる。

(環境)
Windows8.1
Anaconda4.1.1 (python 3.5.2)
(下準備)
cmd.exeを「管理者で実行」
cd c:/py/djangogirls/myproject
activate root

(1)myproject/myprject/urls.py を変更、

(訂正前)
image

(訂正後)
image

(2)myproject/blog/ 下に、urls.py を作成

from django.conf.urls import include, url from . import views

 

from django.conf.urls import include, url
from . import views
urlpatterns = [
url(r’^$’, views.post_list),
]

image

image

(3)python manage.py runserver

してから、ブラウザで、127.0.0.1:8000/ を開く。

image

がっくしだが、cmd.exe に出てくるエラーは、
https://djangogirlsjapan.gitbooks.io/workshop_tutorialjp/content/django_urls/
に記載されているエラーページと同内容のよう。

image

(4)blog/views.py を変更。

def post_list(request):

    return render(request, 'blog/post_list.html', {})

image

この後、127.0.0.1:8000 を開くと、以下のようなエラーページ

image

templateを作ればよいことが分かる。

(5)blog/ フォルダに、templates フォルダを作成し、さらにその下に、blog フォルダを作成する。

image

image

blog/templates/blog フォルダの中に、post_list.html ファイルを作成。

image

cmd.exeで、一度、Ctrl + C でサーバを止めてから、再度、
python manage.py runserver
して、ブラウザで、127.0.0.1:8000 を開くと、まあ、真っ白だけど、エラーは出なくなった。

image

(6)post_list.html を以下のように変更。

<html>
    <head>
        <title>Ola's blog</title>
    </head>
    <body>
        <p>Hi there!</p>
        <p>It works!</p>
    </body>
</html>

image

ブラウザで、127.0.0.1:8000

image

(7)post_list.html を以下のように変更。

<html>
    <head>
        <title>Django Girls blog</title>
    </head>
    <body>
        <div>
            <h1><a href="">Django Girls Blog</a></h1>
        </div>

        <div>
            <p>published: 14.06.2014, 12:14</p>
            <h2><a href="">My first post</a></h2>
            <p>Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus.</p>
        </div>

        <div>
            <p>published: 14.06.2014, 12:14</p>
            <h2><a href="">My second post</a></h2>
            <p>Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut f.</p>
        </div>
    </body>
</html>

image

image

cmd.exe で、Ctrl + C で、サーバを停止しておく。

(8)Herokuにデプロイ

cmd.exe で、以下のように入力。

$ git status

image

$ git add -A .

image

$ git commit -m "Changed the HTML for the site."

image

git push heroku master

image

自分のHerokuのサイトを開く。(今回は、http://floating-beach-54856.herokuapp.com/

image

今回はここまで。続きは後日。。。

スポンサーリンク