웹개발 종합
1.웹개발 종합 01
html은 뼈대 css는 꾸미기 js는 움직이기<head></head>눈에는 보이지 않지만 웹사이트 내의 중요한 요소를 담아두는 곳css, js를 포함한다웹사이트에서 내 페이지를 가져갈 때에도 도움을 준다전반적인 tag 설명태그를 모두 외울 필요는 없고, 필
2.웹개발 종합 02
js는 웹을 움직이는 코드, jquery는 html을 쉽게 조작할 수 있게 해주는 도구, fetch는 짧은 요청을 보내고 받아올 수 있게 해주는 명령어웹개발의 역사와 표준에 따라 모든 브라우저는 기본적으로 js를 이해할 수 있고, 모든 웹서버는 html + css +
3.웹개발 종합 03
fetch 문은 기존 코드와 똑같이 복사해준 뒤 url만 영화 API로 바꿔준다temp_html 에는 바꿔야할 card 부분의 html을 \`\` 을 이용해 넣어준다.각 변수에 data의 row 부분을 넣어준 뒤 ${} 을 이용해 temp_html 부분에 넣어준다.$(
4.웹개발 종합 04
웹페이지가 떠 있으려면 코드가 계속 돌아가면서 listen을 해줘야 하는데, 이렇게 계속 켜져있는 컴퓨터를 '서버' 라고 한다. 요즘은 인터넷 환경에서 이러한 서버를 대여하여 웹페이지를 배포한다. 이를 '클라우드' 라고 한다. 가장 유명한 예시로는 아마존의 AWS가 있
5.프로토콜
프로토콜은 크게 5 계층으로 이루어져 있는데Lv.5 Application - url 주소를 통해 Message 형태로 통신Lv.4 Transport(TCP) - port number 을 통해 segment 형태로 통신Lv.3 Network(IP) - IP address
6.http 헤더
클라이언트와 서버는 응답과 요청을 할 때 '헤더' 라는 것을 데이터의 앞에 넣어 데이터에 대한 기본적인 설정이나 언어, 환경 등의 정보를 전달한다. postman 으로 데이터를 보낸 뒤 결과창의 Header 을 누르면 볼 수 있고, 개발자 도구의 Network 에서도
7.시리얼라이저
웹에 응답을 보낼 때는 정해진 형태 - json - 으로 보내야 한다. 해서 저번 프로젝트를 할 때에는 context 에 딕셔너리 형태의 데이터를 보냈는데, 모든 데이터를 일일히 그렇게 보내기는 굉장히 번거롭고 시간도 많이 걸린다. 그런 의미에서 등장한 것이 시리얼라이
8.사용자 인증
세션은 서버에 생성되며, 토큰에 비해 담고있는 정보의 양이 적기 때문에 용량 또한 작다. 정보의 용량이 작다는 것은 곧 트래픽의 원활함을 의미한다. 그리고 모든 세션을 관리자 서버에서 관리하기 때문에 보안 측면에서 토큰 보다 유리하다. 토큰은 키가 한 번 탈취되면 그
9.JWT 사용해보기
JWT(Jason Web Token)
10.장고 DRF 프론트엔드
우선 프론트엔드는 다른 호스트로 접근하므로 백엔드에서 cors 관련 설정을 해준다. 나는 테스트용으로만 쓸 거라 CORSORIGINALLOW_ALL = True 를 해줬다. 자세한 방법은 여기 참고
11.Testing
이제까지 나는 결과물을 보고 -> 수정하고 -> 다시 결과를 보고 -> 수정하고 의 과정을 반복하는 식의 웹개발을 해왔다. 그러나 장고에서는 이러한 번거로운 과정을 거치지 않고 테스트를 할 수 있도록 unittest 라는 모듈을 제공하고 있다.테스트코드를 작성해야 하는
12.카테고리
article 모델에 미리 카테고리를 지정해서 글을 올릴 때 카테고리를 같이 올릴 수 있게 하려고 한다.우선 카테고리 모델을 따로 만들어준다.article/model.py카테고리는 이름만 넣어줄 것이므로 캐릭터필드 하나만 해줬다.그리고 Article 에 카테고리를 외래
13.AWS 01
aws 에 회원가입을 한 뒤 네트워크 지역을 보면 아시아 태평양(서울), 아시아 태평양(시드니) 등 여러 지역에 보급되어 있는 네트워크를 볼 수 있을 것이다. 그 중 특정 지역을 클릭해서 보면 Availability Zone 이라고 적힌 것을 볼 수 있는데, 이는 가용
14.AWS 02
글로벌 서비스이다.회원가입 시 만들어진 루트 계정은 사용/공유되지 않아야 한다.User 와 Group 을 만들어서 사용해야 한다. \- Group 은 유저의 종류를 지칭한다. \- User 는 실제 로그인하는 사용자이다. \- User 는 Group 에 속하지 않
15.AWS 03
ec2 는 Infrastructure as a Service 중 하나로 하나의 물리 서버를 두고 각 인스턴스는 독립적으로 작동한다. 주로 웹 애플리케이션 호스팅, 데이터베이스 호스팅, 컴퓨터 작업, 애플리케이션 테스트 및 개발에 많이 사용된다. 각 인스턴스는 다양한 운
16.AWS 04
여러 인스턴스에 할당 가능time out -> 보안 규칙 이슈(방화벽 닫힘)connection error -> ec2 내부이슈모든 inbound 는 기본적으로 막혀있다.모든 outbound 는 기본적으로 열려있다.22 : ssh(secure shell) 로 인스턴스에
17.Article Test
테스트를 할 때 setup 을 통해 사용자 정보나 토큰을 받아오곤 하지만, 이러한 셋업은 테스트가 끝나면 사라질 뿐더러 매 테스트마다 필요한 작업이기 때문에 일일히 적어주긴 조금 번거롭다. 그 때 사용할 수 있는 기능이 SetUpTestData 인데, 이를 사용하면 매
18.KPT 회고록 02
매일 회의를 통해 소통했던 점모르는 부분이 있으면 서로 물어보면서 회의했던 점시작 전에 url 을 잘 나눈 점기획을 체계적으로 했던 점매일 소통을 했음에도 소통이 부족했던 점시작 전에 수시로 확인했어야 할 사항을 체크해놓지 못한 점진행 상황을 구두로만 확인한 점깃허브
19.도커 01
ssh -i 다운받은키페어.pem ubuntu@퍼블릭ip 를 치면 내가 킨 인스턴스와 터미널 창이 연결된다. 이때 키페어 관련 에러가 뜰 수 있으니 키페어의 모드를 미리 확인하자. ubuntu 는 내가 우분투로 서버를 켰기 때문에 ubuntu@로 써준 것이다. 그러면
20.도커 02
가상 컨테이너는 가상 머신과 비슷한 개념처럼 보이지만, 다른 환경을 갖고 있다. 우선 가상 머신은 Host OS 위에 앱이 각각 다른 os 를 가져 비교적 무겁게 작동하지만, 가상 컨테이너는 같은 os 위에 도커 엔진을 두어 비교적 가벼운 환경에서 개별적으로 작동할 수
21.도커 03
Dockerfile 우리가 직접 필요한 이미지를 만들어 우분투를 실행할 때 별도의 업데이트 없이 바로 장고를 실행할 수 있도록 만들 수도 있다. 우선 vi Dockerfile 을 통해 도커파일을 생성해준다. 이때 docker-compose 와 마찬가지로 철자가 틀릴 시
22.Django 프로젝트 배포하기
이번에 aws ui 가 리뉴얼 되면서 나도 배포 방법을 리뉴얼해 보려고 한다.우선 네트워크 존을 생성하기 위해 vpc 를 생성해준다.VPC 와 서브넷을 생성하는 이유네트워크 트래픽을 제어하고, 외부에서 접근할 수 있는 자원을 제한할 수 있다. 예를 들어, 방화벽 역할을
23.Django 프로젝트 배포하기
우선 ALB 를 생성할 때ALB 로 포트포워딩하기를 참고하여 8000번으로 포트포워딩을 해준다. 타겟 그룹을 만들 때 포트 번호를 지정해주면 된다. Django 의 포트는 디폴트 8000번이므로 8000번 포트를 열어준다.설정을 해줬으면 내 프로젝트의 settings.