AWS cloud 9 실습

외부에 있는 UI 템플릿

다양한 선택지
- Django + tailwind : 모놀리식으로 추천
- Django + Bootstrap
- Django + Vue : 마이크로식으로 추천 (인원수가 적게 필요)
- Django + React : 마이크로식으로 개발하려면 인원수가 좀 많이 필요

$ mkdir mysite
$ cd mysite
$ python -m venv venv
$ source venv/bin/activate
$ (venv) pip install django==3.2
$ (venv) django-admin startproject tutorialdjango .

settings.py -> 28번째 줄
ALLOWED_HOSTS = ['*']

터미널에 아래 코드를 붙여넣으세요.
sudo wget https://sqlite.org/2022/sqlite-autoconf-3400000.tar.gz
sudo tar -zxf sqlite-autoconf-3400000.tar.gz
cd sqlite-autoconf-3400000/
sudo ./configure
sudo make clean && sudo make -j 20 && sudo make install
sudo cp -rf /usr/lib64/libsqlite3.so.0.8.6 /usr/lib64/libsqlite3.so.0.8.6_bak                
sudo cp -rf /usr/local/lib/libsqlite3.so.0.8.6 /usr/lib64/libsqlite3.so.0.8.6

sqlite3 --version

엔터 한 번 치시고 시작하세요.
$ (venv) cd ..
$ (venv) python manage.py migrate


python manage.py startapp main

settings.py로 들어가서 33번째 줄
INSTALLED_APPS = [
    'main',
    'django.contrib.admin',
    'django.contrib.auth',
    'django.contrib.contenttypes',
    'django.contrib.sessions',
    'django.contrib.messages',
    'django.contrib.staticfiles',
]


url 설계
/ 
/blog
/blogdetails

# urls.py 파일
from django.contrib import admin
from django.urls import path
from main.views import index, blog, blogdetails

urlpatterns = [
    path('admin/', admin.site.urls),
    path('', index),
    path('blog/', blog),
    path('blogdetails/', blogdetails),
]

# views.py 파일
from django.shortcuts import render

def index(request):
    return render(request, 'index.html')

def blog(request):
    return render(request, 'blog.html')

def blogdetails(request):
    return render(request, 'blogdetails.html')


# 이제 각각 html 파일을 만듭니다.
(venv) environment/mysite $ cd main
(venv) environment/mysite/main $ mkdir templates
(venv) environment/mysite/main $ cd templates/
(venv) environment/mysite/main/templates $ touch {index,blog,blogdetails}.html

# 각각 파일에 파일명으로 text를 입력한 후 아래 명령어를 실행합니다.
(venv) environment/mysite/main/templates $ cd ..
(venv) environment/mysite/main $ cd ..
(venv) environment/mysite $ python manage.py runserver 8080



https://startbootstrap.com/theme/clean-blog 에서 파일을 다운로드 받습니다.
post.html -> blogdetails.html
index.html 복사 -> 복사한 파일을 blog.html

mysite > static이라는 폴더 생성
static 폴더 안에 파일 모두 업로드
업로드 한 파일 중 .html파일은 templates로 이동

settings.py 파일 안에 121번째 줄을 아래와 같이 추가

STATIC_URL = '/static/'
STATICFILES_DIRS = [
    BASE_DIR / 'static',
]

각각의 html 파일에 최상단에 아래 코드를 붙여 넣습니다.
{% load static %}

불러오는 양식은 아래와 같은 형태로 변경을 하셔야 합니다.
<img src="{% static 'jeju.jpg' %}">


google에 django blog models
github에 django blog models

https://github.com/devmahmud/DjangoBlog/blob/master/blog/models.py
https://djangocentral.com/building-a-blog-application-with-django/

# urls.py파일 수정
from django.contrib import admin
from django.urls import path
from main.views import index, blog, blogdetails

urlpatterns = [
    path('admin/', admin.site.urls),
    path('', index),
    path('blog/', blog),
    path('blogdetails/<int:post_id>', blogdetails),
]

# models.py 추가
from django.db import models

class Post(models.Model):
    title = models.CharField(max_length = 200, unique = True)
    content = models.TextField()
    updated_on = models.DateTimeField(auto_now = True)
    created_on = models.DateTimeField(auto_now_add = True)

    def __str__(self):
        return self.title


# 터미널창
(venv) environment/mysite $ python manage.py makemigrations
(venv) environment/mysite $ python manage.py migrate

# 어드민 사이트 등록
from django.contrib import admin
from .models import Post

admin.site.register(Post)

# 어드민 유저 생성
python manage.py createsuperuser

python manage.py runserver 8080
/admin으로 접속
게시물 3개 생성

# views.py 수정
from django.shortcuts import render
from .models import Post

def index(request):
    return render(request, 'index.html')

def blog(request):
    posts = Post.objects.all()
    return render(request, 'blog.html', {'posts':posts})

def blogdetails(request, post_id):
    post = Post.objects.get(pk=post_id)
    return render(request, 'blogdetails.html', {'post':post})


# 블로그 페이지 수정
{% for item in posts %}
                    <!-- Post preview-->
                    <div class="post-preview">
                        <a href="post.html">
                            <h2 class="post-title">{{item.title}}</h2>
                            <h3 class="post-subtitle">{{item.contnets}}</h3>
                        </a>
                        <p class="post-meta">
                            Posted by
                            <a href="#!">Start Bootstrap</a>
                            {{item.updated_on}}
                        </p>
                    </div>
                    <!-- Divider-->
                    <hr class="my-4" />
                    {% endfor %}

# 위와 같이 반복되는 내용을 수정해주세요.

# blogdetails에도 아래와 같이 수정
<div class="post-heading">
                            <h1>{{post.title}}</h1>
                            <h2 class="subheading">{{post.content}}</h2>
                            <span class="meta">
                                Posted by
                                <a href="#!">Start Bootstrap</a>
                                on August 24, 2022
                            </span>
                        </div>

---
# a 태그에서 사용하기 위해 name필드 설정
from django.contrib import admin
from django.urls import path
from main.views import index, blog, blogdetails

urlpatterns = [
    path('admin/', admin.site.urls),
    path('', index, name='index'),
    path('blog/', blog, name='blog'),
    path('blogdetails/<int:post_id>', blogdetails, name='blogdetails'),
]


{% url 'some-url-name' v1 v2 %}
{% url 'some-url-name' arg1=v1 arg2=v2 %}

# blog.html을 아래와 같이 수정합니다.
<p>{% url 'index' %}</p>
                    <p>{% url 'blog' %}</p>
                    {% for item in posts %}
                    <p>{% url 'blogdetails' item.pk %}</p>
                    <!-- Post preview-->
                    <div class="post-preview">
                        <a href="/blogdetails/{{ item.pk }}">
                            <h2 class="post-title">{{item.title}}</h2>
                            <h3 class="post-subtitle">{{item.contnet}}</h3>
                        </a>
                        <p class="post-meta">
                            Posted by
                            <a href="#!">Start Bootstrap</a>
                            {{item.updated_on}}
                        </p>
                    </div>
                    <!-- Divider-->
                    <hr class="my-4" />
                    {% endfor %}


---
우리가 하지 않은 것

form
회원가입
db 1:1
     1:다 -> 뎃글
     다:다