[Django] 0811_Django Project로 E-mail 전송하기

1. Anaconda Prompt 실행 후 프로젝트를 실행할 폴더 생성하기

 

 

mkdir + 폴더명으로 폴더 생성 후, cd + 폴더명을 입력해 해당 폴더로 위치 변경

 

---

2. Django Project 실행

 

 

'django-admin startproject config .' 명령어를 통해 프로젝트 실행하기

 

---

  3. Visual Studio Code 실행 후 Open Folder를 통해 생성한 폴더 열기

 

 

 

---

4. Start Bootstrap에서 참조

 

 

저는 Start Bootstrap의 무료 툴을 활용해 연습을 해보기로 했습니다.

관련 테마에 방문해 해당 파일을 다운로드 후 압축을 풀어줍니다.

 

---

5. Visual Studio Code 내에서 url 생성하기

 

urls.py 파일 내에 views 파일에 표현할 주소를 입력해줄겁니다.

from . import views

path('free/', views.free)

그리고 views.py 파일이 없으니 임의적으로 생성해줍니다.

 

---

6. Views.py 파일 내 코드 생성

 

urls.py의 free와 연결 가능한 함수를 생성해주는 단계입니다.

def 함수를 이용해 free를 불러주고, render를 이용해 연결해줍니다.

from django.shortcuts import render

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

이때, 'index.html'은 아까 start bootstrap에서 다운로드한 템플릿의 파일을 의미합니다.

 

---

7. templates와 static 폴더 생성

 

 

free 폴더 하위에 static과 templates라는 명의 폴더를 생성 후, 아까 다운로드하였던 파일을 안에 복사해줍니다.

index.html은 templates로, 나머지는 static으로 넣어줍니다.

 

---

8. Settings.py 설정

 

 

settings.py에 접속하여 templates의 'DIRS'에 위와 같이 입력해주고, STATIC_URL 밑에 해당 식을 입력해줍니다.

대충 제가 이해한 바로 이야기하자면, 두 번째 입력한 해당 디렉터리 내에서, settings.py가 위치한 폴더 내에서 

django가 필요한 파일들을 찾으러 다닐 수 있게 만들어주는 명령어로 이해하고 있습니다.

TEMPLATES = [
    {
        'BACKEND': 'django.template.backends.django.DjangoTemplates',
        'DIRS': [BASE_DIR / 'templates'],

....


STATIC_URL = '/static/'

STATICFILES_DIRS = [ BASE_DIR / 'static' ]

 

이후, terminal 혹은 anaconda prompt를 이용하여 server를 구동시켜주는

'python manage.py runserver'를 이용해 해당 코드가 잘 입력이 되었는지, 잘 열리는지 확인을

해 줄 필요가 있습니다.

해당 표시된 서버 뒤에 생성한 폴더명을 입력해주셔서 들어가시면 됩니다.

참고로, migrate 하라는 경고문이 나오지만 상관없습니다. 데이터베이스를 이용한다면 migrate을 해주고 넘어가야 되지만,

에이터 베이스를 이용하지 않을 것이기 때문에 스킵하도록 하겠습니다.

# 해당 홈페이지에 연결이 되더라도, 이미지가 깨지는 경우가 발생합니다. index.html 내에 asset, js, css가 static 하위에 있다고 입력을 해주시면 해결이 됩니다. 앞에 /static/을 달아주셔야 파일이 깨지는 부분이 없이 원활히 출력할 겁니다.

ex)<script src ="js/scripts.js"

<script src="/static/js/scripts.js"

ex)	<script src ="js/scripts.js"
   
   # 위의 코드에서 아래 코드처럼 앞에 /static/ 입력

	<script src="/static/js/scripts.js"

---

9. Contact 부분 연결하기

 

E-mail을 전송하기 전, Contact 부분의 항목들과의 연결과 더불어 radio 형태의 체크박스를 생성하겠습니다.

아까처럼 url과 views를 연결해주는 입력문을 작성했는데, 문제는 index.html 내 해당 name이 존재하지 않습니다.

이 부분을 직접 입력을 해줍니다.

 

요런 식으로 직접 입력을 해줍니다. 단, views.py에 입력한 name과 동일하게 작성을 해야 오류 없이 작동합니다.

 name과 아까 views.py에 입력한 name에서 해당 위 사진처럼 대문자, 소문자 표기를 잘못해서 오류 발생했으니 작성 시 조심

아까 post방식을 이용하기로 했기 때문에, method와 action, 그리고 csrf_token을 입력해줍니다.

코드를 변경하여 버튼이 활성화되지 않기 때문에, index에서 disabled를 검색해 삭제해줍니다.

 

---

10. Radio 선택자 입력

 

홈페이지 내 contact me 맨 아래에 박스 창을 만들 수 있게 해당 코드를 작성해서 입력해줍니다. 

 

<!-- Choice input-->    
                            <p style="font-size: 1.5rem" >What's your favorite</p>
                            <input type="radio" id='django' name='lang' value='django' />
                            <label for="django">Django</label>
                            <br>
                            <input type="radio" id='css' name='lang' value='css' />
                            <label for="css">CSS</label>
                            <br>
                            <input type="radio" id='html' name='lang' value='html' />
                            <label for="html">HTML</label>
                            <br>
                            <input type="radio" id='python' name='lang' value='python' />
                            <label for="python">Python</label>
                            <br>

 

for 문과 id를 연결시켜 radio 선택자를 형성합니다. name으로 그룹화를 시키고, value값을 생성해 해당 이메일을 전송받았을 때, 값을 온전히 받을 수 있게 만들어줍니다.

 

 

그러면 이렇게 밑에 체크 박스가 나오게 됩니다. 

 

---

10. E-mail 연동하기

 

 

views.py 내에 아래와 같은 코드를 입력해줍니다. 이전 파이썬 수업에서 이메일 연동을 했던 코드를 그대로 차용해서 다시 복습했네요. 

 

    print(full_name, email_address, phone, message, lang)
    sendMail(
        '발신할 이메일',    # 발신자
        '수신할 이메일',    # 수신자
        'Full name : %s\n email : %s\n phone : %s\n message : %s\n lang : %s' % 
        (full_name, email_address, phone, message, lang)     # formatting 이용
        )
    return redirect('/프로젝트 폴더명/')

import smtplib
from email.mime.text import MIMEText
 
def sendMail(from_email, to_email, msg):
    smtp = smtplib.SMTP_SSL('smtp.gmail.com', 465)
    smtp.login(from_email, '앱 비밀번호') 
     #                       내가 생성한 앱 비밀번호
    msg = MIMEText(msg)
    msg['Subject'] = '제목'
    msg['To'] = to_email
    smtp.sendmail(from_email, to_email, msg.as_string())
    smtp.quit()

 

참고로 앱 비밀번호는 구글을 기준으로 내 계정 - 관리에 들어가서 2단계 인증을 한 계정만 앱 비밀번호를 생성할 수 있습니다.

저장 후, 컨택트에 정보를 입력하고 이메일을 보내보겠습니다.

 

 

send를 누르면 아래와 같이 Terminal에 내가 입력한 정보가 출력이 되고, 메일을 확인하면 내가 보낸 내용을 받을 수 있습니다.

 

 

 

정리하는 과정이 길어서 까먹진 않을 것 같습니다.. ㅎ

이상 끗