Skip to content

Latest commit

 

History

History
139 lines (119 loc) · 8.99 KB

README.md

File metadata and controls

139 lines (119 loc) · 8.99 KB

데이터 CRUD 사이트


사용 언어, 프레임워크, 데이터베이스, 클라우드 플랫폼

● Frontend - HTML, CSS, Javascript

● Backend - Django(Python), SQLite3, AWS(Lightsail)


기능 소개

● Django에서 지원하는 회원가입 / 로그인 기능은 Admin 암호 입력해야만 실행

● Admin 암호 입력해서 관리자모드 실행 - Admin 로그아웃/Admin암호변경 가능

● 데이터 CRUD (생성, 읽기, 수정, 삭제)

● 데이터 등록 시 파일(~DFU.zip)에 대해 자동으로 CRC32 계산

● 삭제 및 수정 등, 기타 버튼 클릭 시 비밀번호 요구

● 선택한 데이터 미리보기 기능 모달창 형태로 show (최종화면 + 선택한 해당 데이터)

● 데이터 파일 다운로드 url에서 다운로드 가능

● 로그인 되어 있지 않으면 기본 index 페이지 보이지 않음


사이트 주소

[사이트 바로가기](http://127.0.0.1:8000/) ← AWS Lightsail로 고정 IP 주소 새로 팠으나, 보안을 위해 기재하지 않음

※ Admin 암호 입력해야 이용 가능


구현 과정

1일차

● DFU 파일 관리 사이트(안) 내용 숙지 및 앞으로의 작업 계획 구상

● Django로 작업 결정 및 공부(구글링, 유튜브, 등 ...)


2일차

● CRUD 게시판 Javascript로 구현, 그러나 이는 Frontend 단에서만 작동

● 따라서 Backend의 기능을 위해 데이터베이스 (SQLite3) 필요


3일차

● Django의 SQLite3로 DB 저장 및 불러오기 성공


4일차

● CRUD 기능 모두 구현 완료


5일차

● models.py에 DateTimeField, FileField 생성

● DB 파일 추가 가능, request.FILES 다루기

● CRC32 계산 알고리즘을 Javascript로 구현


6일차

● settings.py에 login/logout redirect url 생성

● views.py에 register함수(UserCreationForm) 생성

● register.html과 registration폴더에 login.html 생성하여 회원가입 / 로그인 마무리


7일차

● models.py에 또 다른 class 만들고 변수들 똑같이 각각 생성

● 선택한 데이터만 따로 추출하여 새롭게 출력하기 ← 선택한 데이터를 이중리스트로 변환한 후 저장, 그 후 checkbox name={{displayst.id}}가 submit 되면 이중리스트 for문, if 문으로 내부리스트(i)들의 0번째 인덱스가 {{display.id}}와 같으면 아까 그 다른 class의 변수들을 모두 새로운 리스트에 append하고 html에 출력

● 암호 설정하여 보안 기능 구현 ← Javascript로 prompt창 만들고 암호 맞으면 form의 onsubmit을 True로 설정해서 내보내기, 틀리면 아무 변화없이 False


8일차

● 미리보기 모달창, 최종화면 생성

● 클래스모델 하나 더 만듬 (미리보기 DB 필요)

● 미리보기의 마지막 인덱스의 value 값들을 따로 저장

● 장고에 기본 탑재된 로그인, 로그아웃 기능과 장고 템플릿 문법을 통해 로그인 할 경우에만 원하는 UI 띄우도록 설정

● 깃허브 올리기


9일차

● 미리보기를 최종화면 + (대기하기한 해당 데이터)으로 변경

● 미리보기 및 최종화면에 삭제 기능 추가

● 번호 삭제하고 버튼 순서 매기기

● 삭제하고 나서 기존 다른 버튼 누르면 오류 발생하여, 해결 ← views.py에서 index.html을 render하는 함수가 총 3개인데, stdisplay가 넘겨주는 값들 중 몇몇을 stdelete와 stdelete2는 넘겨주지 않았기 때문에 발생했던 것

● 회원가입 페이지에서 로그인페이지 url로 이동하도록 구현

● register 페이지에서 Admin 암호 입력해야 회원가입 할 수 있도록 구현


10일차

● PuTTY generator로 pem파일을 ppk로 변환

● 깃허브에 key 등록

● PuTTY configurator로 Lightsail SSH 접속

● uwsgi랑 nginx로 서버 배포 성공

● 웹 글씨 키우기 + 대기하기 누를 시 이벤트 + 메인페이지에 기능 안내 + 최종화면 각 행 맨 앞에 $ 표시

● 로그인해야 화면 보이도록 모두 설정


11일차

● 모든 페이지 구글폰트 적용

● css 꾸미기 및 통일

● Javascript의 querySelectorAll과 forEach, addEventListener, event.target.setAttribute를 통해 for 문 안에 있는 각각의 속성들을 클릭했을 시 이벤트 처리 완료

● 서버 배포한 웹 수정 ← sudo rm -rf DFU-site로 경로 초기화 후 git clone [email protected]:seungjun222/DFU-site.git로 처음부터 다시


12일차

● 로그인 url 오류 고치기 ← 회원가입 / 로그인 폼의 무언가가 중복되어 발생한 것으로 불필요한 링크 없애서 해결

● 삭제하고 나서 기존 index페이지로 새로고침 되어야 하는 것 (~/delete로 주소 바뀌면 각종 잡 오류 발생했었기 때문) 해결 ← views.py의 stdisplay에는 delete_flag를 0으로 설정하고 stdelete와 stdelete2 함수에는 delete_flag를 1로 설정하고 그 값을 각각 index.html로 모두 보냄. 그리고 index.html의 자바스크립트에서 if({{delete_flag}} == 1){ window.location.href="{% url 'stdisplay' %}";}를 입력

● .env로 보안 시도해보기


13일차

● .env 관련 작업 실패 → pw == "{{}}"가 아니라 pw == {{}}로 해결 → 그런데 서버에서 none 뜨면서 오류 발생

● os.environ.get 함수 디폴트값 넣으면 서버에서 none 안 뜨긴 하지만, 개발자도구에서 암호가 보임 → 개선 필요


14일차

● 모든 코드 주석 작성

● 여전히 암호 보안 관련 해결해야 함


15일차

● 암호 보안 문제를 models.py에 새로운 클래스모델(admin 암호 저장용) 추가하여 해결

● 이어서 views.py의 stdisplay에서 logout post되면 admin 암호(마지막 인덱스의 값)를 다른 값으로 바꿔서 로그아웃

● views.py의 stregister에서 암호 받아와서 저장하고 마지막 인덱스를 다시 HTML로 내보내서 마무리

● DateTimeField를 입맛에 맞게 필터 적용 ← time 뒤에 |date:'Y-m-d H:i' 입력


16일차

● 주석 추가, README 작성

● 추가 작업 필요 (Admin 로그아웃과 암호변경은 Admin만 할 수 있어야 함)


17일차

● 정답 Admin 암호, 로그인/로그아웃 여부 판단, 유저가 입력한 암호 이렇게 3가지 저장을 위해 models.py에서 클래스모델 3개 생성

● Admin 암호변경 시, 입력한 값을 정답 Admin 암호 클래스모델에다가 저장. 마찬가지로 유저 암호 입력 시, 유저 암호 클래스모델에 저장

● 유저 암호는 regForm.cleaned_data['password1']라는 메소드로 받아옴

● 카운트 횟수 % 2가 1이면(홀수면) 로그아웃, 0이면(짝수면) 로그인으로 판단

● 정답 Admin 암호 클래스모델의 마지막 인덱스 값을 core에 저장 (core는 정답 Admin 암호를 나타내는 변수)

● HTML(register.html)에서 카운트횟수 1이면 Admin 암호 요구, 0이면 회원가입 양식 띄우기


18일차

● 유저가 입력한 Admin 암호 저장을 위해 models.py에다가 클래스모델 1개 추가

● core변수가 두 함수(def register, display)에서 쓰이기 위해 global 전역변수로 선언

● 유저가 입력한 Admin 암호가 core(정답 Admin 암호)와 일치하면 Admin 로그인으로 판단, count +1 해줌

● Admin 로그아웃 할 때마다 역시 count +1 해줌

● 유저가 입력한 Admin 암호가 정답 Admin 암호와 일치하고, 카운트가 짝수이면(Admin로그인), HTML(index.html)에서 관리자모드 접속 가능하게 해줌

● 유저가 입력한 Admin 암호가 정답과 일치하지 않거나, 카운트가 홀수이면(Admin로그아웃), 관리자모드 접속 불가

● 헷갈리는 용어들 변경(버튼 이름 등)

● README 수정 및 주석 추가