이 가이드에서는 Django, SMS 알림용 Twilio, 보안 미디어 업로드용 Pinata, 반응형 스타일링용 TailwindCSS를 사용하여 안전한 익명 피드백 시스템을 구축하는 과정을 안내합니다. 이 튜토리얼이 끝나면 보안과 개인 정보 보호를 염두에 두고 사용자가 피드백을 제출하고, 선택적으로 미디어를 업로드하고, SMS 알림을 받을 수 있는 완전한 기능의 피드백 시스템을 갖추게 됩니다.

데모: 라이브 링크

주요 특징:

• 익명 피드백 제출: 사용자는 익명으로 피드백을 제출하거나 요청을 지원할 수 있습니다.
• 보안 미디어 업로드: 사용자는 IPFS에 저장된 Pinata를 통해 미디어 파일을 안전하게 업로드할 수 있습니다.
• Twilio SMS 알림: Twilio를 통해 사용자에게 SMS 확인을 자동으로 보냅니다.
• 반응형 UI: 원활하고 현대적인 디자인을 위해 TailwindCSS 스타일을 적용했습니다.

사용된 기술:

• Django: 피드백 시스템을 위한 백엔드 프레임워크.
• Twilio: SMS 알림을 처리합니다.
• Pinata: IPFS 기반의 보안 미디어 저장소를 제공합니다.
• TailwindCSS: 반응형 프런트엔드 스타일을 위한 것입니다.

1단계: 프로젝트 설정 및 종속성

1.1. 가상 환경 생성 및 설정
프로젝트 환경을 설정하는 것부터 시작하세요. Python이 설치되어 있는지 확인하고 가상 환경을 설정하십시오.

python3 -m venv venv
source venv/bin/activate

Windows의 경우:

venv\Scripts\activate

필요한 패키지를 설치합니다:

pip install django twilio python-decouple requests gunicorn

1.2. Django 프로젝트 시작
새 Django 프로젝트 및 앱을 초기화합니다.

django-admin startproject config .
python manage.py startapp feedback

2단계: 피드백 제출 시스템 구축

2.1. 피드백 모델 만들기
Feedback/models.py:

from django.db import models

class Feedback(models.Model):
    message = models.TextField()
    sender_email = models.EmailField()
    sender_phone = models.CharField(max_length=15)
    media_url = models.URLField(null=True, blank=True)
    created_at = models.DateTimeField(auto_now_add=True)

    def __str__(self):
        return f"Feedback from {self.sender_email}"

이 모델은 피드백, 이메일, 전화번호 및 선택적 미디어 URL을 캡처합니다.

2.2. 피드백 및 SMS 알림 처리를 위한 뷰 생성
Feedback/views.py에서 피드백을 처리하고 SMS 알림을 보내는 보기를 만듭니다.

from django.shortcuts import render
from django.http import HttpResponse
from .models import Feedback
from twilio.rest import Client
from django.conf import settings
import requests

def upload_to_pinata(file):
    url = "https://api.pinata.cloud/pinning/pinFileToIPFS"
    headers = {
        'pinata_api_key': settings.PINATA_API_KEY,
        'pinata_secret_api_key': settings.PINATA_SECRET_API_KEY,
    }
    files = {'file': file}
    response = requests.post(url, files=files, headers=headers)
    return response.json().get('IpfsHash')

def submit_feedback(request):
    if request.method == 'POST':
        message = request.POST.get('message')
        sender_email = request.POST.get('sender_email')
        sender_phone = request.POST.get('sender_phone')
        file = request.FILES.get('media_file', None)

        media_url = None
        if file:
            media_url = upload_to_pinata(file)

        feedback = Feedback.objects.create(
            message=message,
            sender_email=sender_email,
            sender_phone=sender_phone,
            media_url=media_url
        )

        # Send SMS using Twilio
        client = Client(settings.TWILIO_ACCOUNT_SID, settings.TWILIO_AUTH_TOKEN)
        client.messages.create(
            body=f"Feedback received from {sender_phone}: {message}",
            from_=settings.TWILIO_PHONE_NUMBER,
            to=sender_phone
        )

        return HttpResponse("Feedback submitted successfully!")

    return render(request, 'feedback_form.html')

이 보기는 양식 제출을 처리하고, 선택적 미디어를 Pinata에 업로드하고, Twilio를 사용하여 SMS를 보냅니다.

2.3. 피드백 양식 만들기
피드백을 제출하려면 HTML 양식을 만드세요. 템플릿 폴더에서 Feedback_form.html:

{% load static %}



    

        
Submit Feedback
        

            {% csrf_token %}
            

                Your Feedback
                
            

                Your Email
                
            

                Your Phone Number
                
            

                Upload Media (Optional)
                
            

                Submit
            
        
    

프런트 엔드 이미지

업로드된 파일을 보여주는 Pinata 대시보드 이미지

3단계: Twilio 및 Pinata 구성

3.1. 환경 변수 설정
Twilio 및 Pinata API 키와 같은 중요한 정보를 저장하려면 프로젝트의 루트 디렉터리에 .env 파일을 만듭니다.

SECRET_KEY=your-django-secret-key
DEBUG=True

TWILIO_ACCOUNT_SID=your_twilio_account_sid
TWILIO_AUTH_TOKEN=your_twilio_auth_token
TWILIO_PHONE_NUMBER=your_twilio_phone_number

PINATA_API_KEY=your_pinata_api_key
PINATA_SECRET_API_KEY=your_pinata_secret_api_key

GitHub으로 푸시되지 않도록 .gitignore 파일에 .env를 추가하세요.

.env

3.2. 환경 변수를 사용하도록 settings.py 업데이트
python-deconnect를 사용하여 .env 파일에서 환경 변수를 안전하게 로드합니다.

from decouple import config

SECRET_KEY = config('SECRET_KEY')
DEBUG = config('DEBUG', default=False, cast=bool)

TWILIO_ACCOUNT_SID = config('TWILIO_ACCOUNT_SID')
TWILIO_AUTH_TOKEN = config('TWILIO_AUTH_TOKEN')
TWILIO_PHONE_NUMBER = config('TWILIO_PHONE_NUMBER')

PINATA_API_KEY = config('PINATA_API_KEY')
PINATA_SECRET_API_KEY = config('PINATA_SECRET_API_KEY')

4단계: GitHub로 푸시

4.1. Git 초기화 및 GitHub로 푸시

1. 프로젝트 루트에서 Git 저장소를 초기화합니다.

git init
git add .
git commit -m "Initial commit for feedback system"

1. GitHub 저장소를 원격 저장소로 추가하고 프로젝트를 푸시하세요.

git remote add origin https://github.com/yourusername/feedback-system.git

git push -u origin main

결론

이 튜토리얼에서는 Django, SMS 알림용 Twilio, 미디어 업로드용 Pinata를 사용하여 안전한 익명 피드백 시스템을 구축했습니다. 또한 프로젝트를 GitHub에 푸시하고 환경 변수를 사용하여 중요한 정보를 보호하는 방법도 배웠습니다. 이 시스템은 사용자가 피드백을 제출하고 SMS 알림을 받을 수 있도록 하는 동시에 개인정보를 보호합니다.

더 많은 기능을 추가하거나 보안을 강화하여 시스템을 더욱 확장해 보세요. 이 가이드가 도움이 되었다면 댓글로 피드백이나 질문을 공유해 주세요!

프로젝트에 대한 Repo는 여기에서 찾을 수 있습니다: Repo