【プログラミング教室】テキスト

はじめてのコンピュータ
プログラミング教室

スケジュール
１日目午前オリエンテーション
自己紹介
この教室で作成するプログラムのデモ
まずは簡単なプログラムを作ろう
プログラムに必要なファイルの説明
午後名前を入力するプログラムを作ろう
プログラムを作るための基本を知ろう
クイズのデータを入力しよう
２日目午前プログラムの動きを知ろう
クイズプログラムを作ろう（１）
HTMLを覚えよう
午後クイズプログラムを作ろう（２）
感想の発表

この教室の目的
インターネットで動くプログラムを
作成する方法を学習します

教室のルール
1. できないことは恥ずかくない
– できなくても恥ずかしくありません。わからな
かったら元気よく質問しよう！
2. みんなが先生
– この教室ではみんなが先生です。わからない人
がいたら積極的に助けましょう。
3. 人前で発表しよう
– 人とわかりあうためには意見を発表できることが
大切です。自分の意見を積極的に発信しよう！

[1-4-1] 端末の起動
画面左上の「Dashホーム」をクリッ
ク、検索に「teminal」と入力、下に
表示された「端末」をダブルクリッ
クします

[1-4-2] 準備の作業
$ sudo apt-get update
$ sudo apt-get install python-pip
$ sudo apt-get install sqlite3
$ sudo pip install django
---------------------------------------------------------
$ django-admin.py startproject quiz
$ cd quiz
$ python manage.py runserver
端末の中に次のコマンドを入力します。

準備の作業
画面左の「Firefox」を起動してアドレ
スに「127.0.0.1:8000」を入力して
Enterを押す

[2-1-1] 新しい機能の作成
$ python manage.py startapp quiz
「quiz」という名前の新しい機能を作成しま
す。

[2-1-2] quiz/settings.py ①
12. DATABASES = {
13. 'default': {
14. 'ENGINE': 'django.db.backends.sqlite3',
15. 'NAME': 'quiz.sqlite3',
16. 'USER': '',
17. 'PASSWORD': '',
18. 'HOST': '',
19. 'PORT': '’,
20. }
21. }
…..
32. TIME_ZONE = 'Asia/Tokyo’
…..
36. LANGUAGE_CODE = 'ja-jp'

[2-1-3] quiz/settings.py ②
116. INSTALLED_APPS = (
117. 'django.contrib.auth',
118. 'django.contrib.contenttypes',
119. 'django.contrib.sessions',
120. 'django.contrib.sites',
121. 'django.contrib.messages',
122. 'django.contrib.staticfiles',
123. # Uncomment the next line to enable the admin:
124. 'django.contrib.admin',
125. # Uncomment the next line to enable admin documentation:
126. # 'django.contrib.admindocs',
127. 'quiz’,
128. )

[2-1-4] quiz/models.py
1. # -*- coding: utf-8 -*-
2. from django.db import models
3.
4. class Quiz(models.Model):
5. question = models.CharField('問題', max_length=255)
6. answer01 = models.CharField('答え01', max_length=255)
9. answer = models.IntegerField('正解番号')

[2-1-5] データベースの作成
データベースの定義をしたので、データ
ベースの作成を行います。
$ python manage.py syncdb

[2-2-1] quiz/admin.py
1. from quiz.models import Quiz
2. from django.contrib import admin
3.
4. admin.site.register(Quiz)

[2-2-2] quiz/urls.py
1. from django.conf.urls import patterns, include, url
2.
3. # Uncomment the next two lines to enable the admin:
5. admin.autodiscover()
6.
7. urlpatterns = patterns('',
…
16. url(r'^admin/', include(admin.site.urls)),
17. )

[2-2-3] 実行してみよう
コマンドを入力してブラウザを起動しましょう。
ブラウザのアドレスに「127.0.0.1:8000/admin/」と入力するとデータの入力が
できるようになります。

「◯◯さん、こんにちは」
プログラムの作成

[3-1-1] 新しいプロジェクトの作成
$ django-admin.py startproject hato
$ cd hato
$ python manage.py startapp nameform
$ mkdir templates
「hato」という名前の新しいプロジェクトを作成
して、作業場所をhatoディレクトリにします。
次に名前を入力する機能「nameform」を作成しま
す。
さらに画面を入れるフォルダ「templates」を作成
します。

[3-1-2] フォルダ構成
hato ・・・プロジェクトの設定をするフォルダ
__init__.py ・・・無視してOK
settings.py ・・・プログラム全体の設定
urls.py ・・・プログラムの名前を書く
wsgi.py ・・・無視してOK
manage.py ・・・管理コマンド
nameform ・・・機能を入れるフォルダ
__init__.py ・・・無視してOK
models.py ・・・データベースの設定
test.py ・・・無視してOK
views.py ・・・データベースと画面の処理
templates ・・・画面のファイルを入れる

[3-1-3] hato/settings.py ①
2. import os
…..
32. TIME_ZONE = 'Asia/Tokyo’
…..
36. LANGUAGE_CODE = 'ja-jp’
…..
111. TEMPLATE_DIRS = (
112. # Put strings here, like "/home/html/django_templates" or
"C:/www/django/templates".
113. # Always use forward slashes, even on Windows.
114. # Don't forget to use absolute paths, not relative paths.
115. os.path.join(os.path.dirname(__file__), '..', 'templates').replace('','/'),
116. )

[3-1-4] hato/settings.py ②
116. INSTALLED_APPS = (
117. 'django.contrib.auth',
118. 'django.contrib.contenttypes',
119. 'django.contrib.sessions',
120. 'django.contrib.sites',
121. 'django.contrib.messages',
122. 'django.contrib.staticfiles',
124. # 'django.contrib.admin',
125. # Uncomment the next line to enable admin documentation:
126. # 'django.contrib.admindocs',
127. ’nameform’,
128. )

[3-1-5] hato/urls.py
2.
3. urlpatterns = patterns('',
4. url(r'^$', 'nameform.views.index'),
5. )

[3-2-1] フォームファイルの作成
1. ホームフォルダーの左ペインから「hato-namefom」を選択
2. マウスの右ボタンをクリックして「新しいドキュメントの
作成ー空のドキュメント」を実行
3. 無題のドキュメントを「forms.py」に変更

[3-2-2] hato/forms.py
1. # -*- coding: utf-8 -*-
2. from django import forms
3.
4. class MynameForm(forms.Form):
5. myname = forms.CharField(
6. label='あなたの名前は',
7. max_length=20,
8. help_text='（最大文字数２０文字）'
9. )

[3-2-3] hato/views.py
1. # -*- coding: utf-8 -*-
2. from django.shortcuts import render_to_response
3. from django.template import RequestContext
4. from django.http import HttpResponse
5. from nameform.forms import MynameForm
6.
7. def index(request):
8.
9. if request.method == 'POST':
10. myname = request.POST.get('myname')
11. massage = u'こんにちは、' + myname + u'さん'
12. return HttpResponse(massage)
13. else:
14. form = MynameForm()
15. return render_to_response('form.html', {
16. 'from': form,
17. }, context_instance=RequestContext(request))

[3-2-4] templates/form.html
1. <form action="" method="POST">{% csrf_token %}
2. {{ from.as_p }}
3. <input type="submit" value="実行する">
4. </form>

[3-2-5] 実行してみよう
コマンドを入力してブラウザを起動しましょう。
ブラウザのアドレスに「127.0.0.1:8000/admin/」と入力するとデータの入力が
できるようになります。

[4-2-1] 変数
たろう
じろう
さぶろう
しろう
変数はコンピュータの中に作る箱です。
• 箱はいくつでも作れます
• 箱は好きなもの（型）を好きなだけ
入れられます
• 箱には名前をつけます

[4-2-2] 型
今日の天気は?
12345
0.54321
2013/07/29
10, 15, 20, 24, 18

[4-2-3] 代入と式
箱に型を入れることを代入と呼
びます
value = 21+14
value
「21」と「＋」と「14」を
箱(value)に代入と箱(value)には35が入ります。

[4-2-3] 判断
変数に何が入っているかを確認
するときに判断を利用します。
変数Aに入っている値は10より大きい？
大きかったら5を引く、少なかった5を足す
if a > 10:
a = a – 5
else:
a = a + 5

[4-2-3] 繰り返し
複数回同じ処理を繰り返すことを
ループと呼びます。
goukei = 0
for i in range(10) :
goukei = goukei + i
0から9までを足します

[4-2-3] 処理
式と判断と繰り返しを組分せせたものを処
理と呼びます。
# 登録ブログのクロールを開始する
for blog in blogs:
logging.info('-[' + str(blog.id) + ']' + blog.blog_title)
now = datetime.datetime.now()
blog.last_crawled = pytz.timezone(settings.TIME_ZONE).localize(now)
blog.save()
# 各エントリーの取得
feeds = feedparser.parse(blog.blog_rss)
for feed in feeds.entries:
logging.info('---' + feed.title)
# 日付のタイムゾーンを設定情報に合わせる
dt = feed.updated_parsed
update_date_local = datetime.datetime(dt[0], dt[1], dt[2], dt[3], dt[4])
update_date = pytz.timezone(settings.TIME_ZONE).localize(update_date_local)

クイズプログラムの
作成

[5-3-1] quiz/models.py
1. # -*- coding: utf-8 -*-
2. from django.db import models
3.
4. class Quiz(models.Model):
5.
6. question = models.CharField(‘もんだい', max_length=255
7. answer01 = models.CharField(’こたえ01', max_length=255)
8. answer02 = models.CharField(‘もんだい02', max_length=255)
9. answer03 = models.CharField(‘もんだい03', max_length=255)
10. answer = models.IntegerField(‘せいかいばんごう')
11.
12. def __unicode__(self):
13. return self.question

1. # -*- coding: utf-8 -*-
3.
7.
8. urlpatterns = patterns('’,
9. url(r'^$', ’quiz.views.home’),
10. url(r'^start/', ’quiz.views.start'),
12. )

[5-3-3] templates/home.html
1. <h1>メニュー</h1>
2. <p>
3. <a href="/start/">始める</a>
4. </p>
5. <p>
6. <a href="/ranking/">ランキングを見る</a>
7. </p>

[5-3-4] templates/start.html
1. <form action="/question/" method="POST">{% csrf_token %}
2. <p>あなたの名前を入力してください</p>
3. <input type="text" name="challenger" size="20" maxlength="20" />
4. <input type="hidden" name="question_count" value="0" />
5. <input type="hidden" name="correct_count" value="0" />
6. <input type="submit" value="クイズを始める" />
7. </form>

[5-4-1] quiz/views.py
1. # -*- coding: utf-8 -*-
2. from django.shortcuts import render_to_response
3. from django.http import HttpResponse
4. from django.template import RequestContext
5. from quiz.models import Quiz
6. import random
7.
8. def home(request):
9. return render_to_response('home.html', {
11.
12. def start(request):
13. return render_to_response('start.html', {

1. # -*- coding: utf-8 -*-
3.
7.
9. url(r'^$', 'quiz.views.home’),
10. url(r'^start/', 'quiz.views.start'),
11. url(r'^question/', 'quiz.views.question'),
13. )

[5-6-1] templates/question.html
1. <form action="/check/" method="POST">{% csrf_token %}
2. <input type="hidden" name="question_id" value="{{ question_id }}" />
3. <input type="hidden" name="challenger" value="{{ challenger }}" />
4. <input type="hidden" name="question_count" value="{{ question_count }}" />
5. <input type="hidden" name="correct_count" value="{{ correct_count }}" />
6. <p>{{ challenger }}さん、がんばれ！</p>
7. <p>{{ question_count }}問目
8. <h1>問題：{{ question }}</h1>
9. 解答
10. <ol>
11. <li>{{ answer1 }}</li>
12. <li>{{ answer2 }}</li>
13. <li>{{ answer3 }}</li>
14. </ol>

[5-6-2] templates/question.html
15. <input type="text" name="input_answer" size="5" maxlength="1" />
16. <input type="submit" value="答える" />
17. </form>

1. def question(request):
3. # 問題の取得
4. record_count = Quiz.objects.count()
5. get_id = random.randint(1, record_count)
6. record = Quiz.objects.get(pk=get_id)
7. # -- 挑戦者名
8. challenger = request.POST.get('challenger', '')
9. # -- 何問目か
10. question_count = int(request.POST.get('question_count', ''))
11. question_count = question_count + 1
12. # -- 正解数
13. correct_count = request.POST.get('correct_count', '’)

1. # -- 問題のID
2. question_id = record.id
3. # -- 表示する問題と解答群
4. question = record.question
5. answer01 = record.answer01
8.
9. return render_to_response('question.html', {
10. # -- チャレンジの最後まで保有する値
11. 'question_count': question_count,
12. 'correct_count': correct_count,
13. 'challenger': challenger,

1. # -- 正解のチェックまで保有する値
2. 'question_id': question_id,
3. # -- その他の値
4. 'question': question,
5. 'answer1': answer01,
9.
10. else:
11. massage = u'挑戦者名が設定されていません。’

[5-6-6] templates/check.html
1. <form action="/question/" method="POST">{% csrf_token %}
2. <input type="hidden" name="challenger" value="{{ challenger }}" />
3. <input type="hidden" name="question_count" value="{{ question_count }}" />
4. <input type="hidden" name="correct_count" value="{{ correct_count }}" />
5. <input type="submit" value="次の問題に進む" />
6. </form>

1. def check(request):
3. # -- 挑戦者名
4. challenger = request.POST.get('challenger', '')
5. # -- 何問目か
6. question_count = int(request.POST.get('question_count', ''))
7. # -- 正解数
8. correct_count = int(request.POST.get('correct_count', ''))
9. # -- 入力された答
10. input_answer = int(request.POST.get('input_answer', ''))
11. # -- 問題の正解の取得
12. question_id = request.POST.get('question_id', '')
13. record = Quiz.objects.get(pk=question_id)
14. answer = int(record.answer)

1. # -- 正解のチェック
2. if input_answer == answer:
3. correct_count = correct_count + 1
4. message = u'すごい！正解です！！'
5. else:
6. message = u'ざんねん！不正解です！！'
7.
8. if question_count == 5:
9. # -- ランキングデータの保存
10. histry = Histry(name=challenger, points=correct_count)
11. histry.save()
12. return render_to_response('finish.html', {

1. else:
2. return render_to_response('check.html', {
4. 'question_count': question_count,
7. # -- 正解、不正解のメッセージ
8. 'message': message,
10.
11. else:
12. massage = u'挑戦者名が設定されていません。'

1. # -*- coding: utf-8 -*-
3.
7.
9. url(r'^$', 'quiz.views.home'),
10. url(r'^start/', 'quiz.views.start'),
11. url(r'^question/', 'quiz.views.question'),
12. url(r'^check/', 'quiz.views.check'),
13. url(r'^ranking/', 'quiz.views.ranking'),
15. )

1. def ranking(request):
2. persons = Histry.objects.all().order_by('-points')[:10]
3. return render_to_response('ranking.html', {
4. 'persons':persons,

[5-7-2] templates/ranking.html
1. <h1>得点ランキング</h1>
2. <ol>
3. {% for person in persons %}
4. <li>{{ person.name }}さん - {{ person.points }}点</li>
5. {% endfor %}
6. </ol>

用語
• データベース
– データを保管するためのプログラム。データベース保管するとデータ
の取り出しが簡単になる。
• Python
– プログラミング言語。プログラムを作成するための言葉。Pythonの他に
もPHPやJAVA等がある。
• Django
– プログラミングフレームワーク。プログラムを簡単につるくための道
具。
• エディタ
– 文字を入力するためのプログラム。
• Terminal（端末）
– コンピュータに命令を入力するためのプログラム。
• WEBブラウザ
– インターネットを見るためのプログラム。

TIPS
• アルファベットと漢字の切り替え
– [CTRL] を押しながら [SPACE] を押す

この教室で利用したソフト
• OS – Ubuntu Desktoo 日本語 Remix 12.04
• データベース – sqlite3 3.7.9
• プログラム言語 – Python 2.7.4
• フレームワーク– Django 1.5.1

【プログラミング教室】テキスト

Recomendados

Recomendados

Más contenido relacionado

Destacado

Destacado (12)

Similar a 【プログラミング教室】テキスト

Similar a 【プログラミング教室】テキスト (20)

【プログラミング教室】テキスト