Diff for "EnglishStudyWithDjango"

Differences between revisions 17 and 32 (spanning 15 versions)

Django와 함께 EnglishStudy하기

http://gmp.biohackers.net

대안언어축제2006 BoF 세션 EnglishStudyWithDjango

이후로도 프로젝트는 계속 진행됩니다. wiki/GmpStudy

-  ⇤ ← Revision 17 as of 2006-08-30 18:41:43 → 
  Size: 5162
  Editor: 218
  Comment:
+   ← Revision 32 as of 2012-08-17 10:51:31 → ⇥
  Size: 218
  Editor: 182
  Comment:
-Deletions are marked like this.
+Additions are marked like this.
 Line 1:
-#acl falsetru:read,write,admin,revert
대안언어축제2006 BoF 세션
+[[Django]]와 함께 EnglishStudy하기
-Line 4:
+Line 3:
-개괄적 설명은 http://altlang.org/fest/EnglishStudyWithDjango
+http://gmp.biohackers.net
-Line 6:
+Line 5:
-발표당일 공개할 내용들을 이곳에 정리
+대안언어축제2006 BoF 세션 AltLang:EnglishStudyWithDjango
-Line 8:
+Line 7:
-[[TableOfContents]]

== 개요 ==
Django란?

고전적인 DB기반 웹어플리케이션 구축
 1. 데이터베이스 설계
 1. create db, table
 1. list, detail, insert, update, delete programming with HTML, CSS, JavaScript

Django에서는
 1. Model
 1. URL
 1. View
 1. Template

== 실습 진행 ==

=== 프로젝트, 사이트 생성 ===

altlang 프로젝트(사이트)생성
{{{
C:\work>django-admin.py startproject altlang
C:\work>cd altlang
C:\work\altlang>dir /b
manage.py
settings.py
urls.py
__init__.py
}}}

eswd 어플리케이션생성
{{{
C:\work\altlang>django-admin.py startapp eswd
C:\work\altlang>dir /b eswd
models.py
views.py
__init__.py
}}}

Database 연결확인 (DB와 Django와 동기화)
{{{
C:\work\altlang>manage.py syncdb
 ...
django.core.exceptions.ImproperlyConfigured: You haven't set the DATABASE_ENGINE setting yet.
 ...
}}}

<r0>

데이터베이스 설정
{{{
--- a/settings.py       Wed Aug 30 16:14:44 2006 +0900
+++ b/settings.py       Wed Aug 30 16:17:17 2006 +0900

-DATABASE_ENGINE = ''
-DATABASE_NAME = ''
+DATABASE_ENGINE = 'sqlite3'
+DATABASE_NAME = r'c:\work\altlang\gmp.db'

@@ -74,4 +74,6 @@ INSTALLED_APPS = (
     'django.contrib.contenttypes',
     'django.contrib.sessions',
     'django.contrib.sites',
+    'django.contrib.admin', # for Admin interface
+    'eswd', # Out English Study With Django App.
 )
}}}

Django 기본 DB 생성
{{{
C:\work\altlang>manage.py syncdb
}}}

<r1>

URL 설정 (전역)
{{{
--- a/urls.py   Wed Aug 30 16:21:50 2006 +0900
+++ b/urls.py   Wed Aug 30 16:35:30 2006 +0900
-#     (r'^admin/', include('django.contrib.admin.urls')),
+    (r'^admin/', include('django.contrib.admin.urls')),
}}}

<r2>


=== 모델링에서 동작확인까지 ===
GMP 홈페이지 (http://www.kbs.co.kr/radio/coolfm/gmp/study/bbw/index.html )에서 뉴스 구조 확인

eswd/models.py
{{{
class News(models.Model):
    pub_date = models.DateField()
    content = models.TextField(maxlength=1000)
    translation = models.TextField(maxlength=1000)
    mp3_url = models.URLField()
}}}

syncdb 후 admin 페이지에서 확인. 이후, __str__ 추가로 바뀌는 내용 확인

<r3>

urls.py 에 news_list 를 보여줄 URL 추가

eswd/views.py 에 news_list 를 보여줄 view 추가

<r4>

mkdir eswd/templates  

eswd/templates/news_list.html 템플릿 추가

쉘에서 모델객체 확인

{{{
C:\work\altlang>manage.py shell
>>> from eswd.models import News
>>> News.objects.all()
[<News: news on 2006-05-19>, <News: news on 2006-05-24>]
>>> n = News.objects.get(id=1)
>>> n
<News: news on 2006-05-19>
>>> n.pub_date
datetime.date(2006, 5, 19)
>>> n.content
'The US moved today to restore full diplomatic relations with Libya. The two countries have not had formal ties since 1980.'
>>> n.mp3_url
'http://cgi.kbs.co.kr/bbs/ezboard.cgi?db=2Fgmpops5&action=down&dbf=1408&downfile=friday-re.mp3&/friday-re.mp3'
}}}

뷰에서 모델추가

<r5>

news_detail 추가 (링크만들고, 뷰)

mp3_url embed.

content, translation 추가

<r6>

자바스크립트로 content, translation 을 숨기기

<r7>



체크를 위한 자바스크립트 추가
{{{
function show_check_result() {
    if (req.readyState == 4)
        document.getElementById('check_dictation').innerHTML = req.responseText;
}

function check_dictation(dbname, check_url, answer_textarea) {
    answer = document.getElementById(answer_textarea);
    answer = escape(answer.value);

    try {
        req = new ActiveXObject("Msxml2.XMLHTTP");
    } catch (e) {
        try {
            req = new ActiveXObject("Microsoft.XMLHTTP");
        } catch (e2) {
            req = false;
        }
    }
    if (!req && typeof XMLHttpRequest != 'undefined')
        req = new XMLHttpRequest();

    req.open("POST", check_url, true);
    req.onreadystatechange = show_check_result;
    req.send('answer=' + answer);
}

}}}


=== MP3 파일의 추가 ===
 1. model 수정
 1. 사용자 로그인 및 개인별 성적페이지

=== key expression 테이블의 추가 ===

=== difflib, Ajax를 이용한 받아쓰기 체크 ===

=== 로그인 기능 구현 ===

=== 개인별 기록표 ===

=== 웹디자인 적용 ===

== 기타 정보 ==
서비스를 위해 추가로 해야할 일들 
 1. 데이터 입력 스크립트
 1. mod_python 등을 이용한 서비스

http://biohackers.net/wiki/EnglishStudyWithDjango 에서 프로젝트가 계속 진행됩니다. 같이 참여하고 싶은 분들의 참가를 환영합니다.

== 에필로그 ==
청중들로 부터, 추가로 구현했으면 하는 아이디어를 접수 받는다. 쉽게 시연 가능한 것이라면, 그자리에서 바로 구현하여 보여주고, 그렇지 않은 경우, 해결방법을 제시한다. 

== 코멘트 ==
(코멘트를 남겨주세요)
+이후로도 프로젝트는 계속 진행됩니다. YongsLib:wiki/GmpStudy