만기레벨업일지

웹서비스 런칭 내가 작업한 페이지를 배포하여 누구나 볼 수 있게 하는 작업이다. 항상 컴퓨터를 켜서 서버를 유지할 수 없으므로 AWS라는 클라우드 서비스를 이용한다. AWS AWS EC2 서버 구매하기 (OS : 리눅스 ubuntu 20.04) https://ap-northeast-2.console.aws.amazon.com/ec2/v2/home?region=ap-northeast-2 서버를 구매하며 받은 키페어도 잘 보관해야 한다. 이제 구매한 ubuntu 컴퓨터에 원격 접속해보자. ※ 미리 5000포트 열어주기. 구매한 인스턴스에서 보안그룹 → edit inbound rules → 포트 2개 추가 → 포트범위 5000 하나, 80 하나 생성 → 소스는 anywhere-ipv4 → 규칙 저장. Git ..

Flask 프레임워크 서버를 구동시켜주는 편한 코드 모음이다. 서버를 구동하려면 필요한 복잡한 일들을 쉽게 가져다 쓸 수 있다. 통상적으로 서버를 돌리는 파일은 app.py라고 짓는다. - flask 시작 코드 from flask import Flask app = Flask(__name__) @app.route('/') def home(): return 'This is Home!' if __name__ == '__main__': app.run('0.0.0.0',port=5000,debug=True) app.py 파일에서 우클릭 → run app 후에 크롬에서 localhost:5000 접속 가능 - flask 기본 폴더 구조 1. app.py 파일 2. templates 폴더 생성, 안에 html 파일 ..

Python 프로그래밍 언어. 다른 언어들보다 직관적이고 배우기 쉽다. - 파이썬 패키지 : 여러기능들을 사용할 수 있는 외부 라이브러리 - venv : 설치된 패키지를 모아놓는 가상환경 폴더이다. 절대 수정이나 삭제하면 안된다. - 파이썬 기본 문법 - 변수 a = 3 # 3을 a에 넣는다 b = a # a를 b에 넣는다 a = a + 1 # a+1을 다시 a에 넣는다 num1 = a*b # a*b의 값을 num1이라는 변수에 넣는다 name = 'bob' # 변수에는 문자열이 들어갈 수도 있다. ' ' is_number = True # True 또는 False -> "Boolean"형이 들어갈 수도 있다. - 자료형 (리스트,딕셔너리) a_list = [] a_list.append(1) # 리스트에 ..

▶ 내일배움캠프 첫번째 미니프로젝트 : 팀 소개 웹 페이지 만들기 ▶ 코드 작성 >html - 웹 폰트, 부트스트랩, jquery 사용을 위해 링크 입력. - 태그가 복잡해져서 css파일을 만들어 파일 불러오기. - 도 마찬가지로 jquery 코드가 많아져 .js파일 만들고 불러오기. - css/style1.css => 파일 경로. css폴더 안에 style1.css 라는 파일이 있다. > html 의 일부 코드 질문Q.어떤 팀 인가요? A1. 답변1.🧑‍🤝‍🧑 A2. 답변2.👍 A3. 답변3.💪 - 사용하여 css 적용될 그룹 묶기. - 사용하여 문단 구분. - : 일부분의 스타일을 적용시키기 위해 사용. - : 줄바꿈 기능. - : 가로선 삽입. > css 파일 부분 코드 /*전체 폰트 적용*/ * ..

▶ 내일배움캠프 첫번째 미니프로젝트 : 팀 소개 웹 페이지 만들기 ▶ 필수 조건, 기능 - 팀원별 소개 및 팀 소개 - HTML, CSS 사용 (부트스트랩이나 자바스크립트 사용은 옵션) ▶ 진행 1. 팀원들과 컨셉, 방향성 논의 - 전체적으로 깔끔하고 보기 편해야한다. (색과 배치) - 디자인은 팀 이름 12간지를 컨셉으로 꾸민다. - 팀 소개는 Q&A 형식, 팀원 소개는 간략히 소개 후 링크걸기 2. 프레임 구성 및 필요 기능 정리 - Title 부분 : html과 css 사용하여 큰 글자 배치 및 배경 이미지와 디자인 이미지 배치 => 웹폰트사용, 이미지 가져오기 - 팀 소개 부분 : 기본적인 팀 소개와, 우리 팀의 특징, 목표, 약속 을 주제로 넣는다. => 부트스트랩 가져오기 - 팀원 소개 부분 ..

Javascript 프로그래밍 언어 중 하나로, 브라우저가 알아들을 수 있는 언어이다. 일반적인 프로그래밍 언어와 달리 하나의 완성된 프로그램보다는 코드 사이에 들어가 페이지에서 동작하고 움직이는 것들을 제어한다. head 안에 로 작성해서 사용한다. Javascript 기본 문법 배우기 - 변수, 자료형(list,dict), 함수, 조건문, 반복문 - 변수 let a = 1 //let으로 변수 선언 let b = 2 console.log(a+b) //콘솔에 찍어내기(크롬페이지에서 F12). 테스트시에 사용해가면서 작업하면 편함 a+b // 3 a/b // 0.5 let first = 'Bob' //문자열은 ' ' 사용 let last = 'Lee' - 자료형 : list let b_list = [1,2..

서버와 클라이언트 - 동작 개념 : 클라이언트가 서버 API(창구)에 요청 서버는 만들어진 파일을 보내준다. 클라이언트는 받아서 그려준다. - 서버 → 클라이언트 : HTML(뼈대), CSS(꾸미기), 자바스크립트(동작), 데이터(json) html 과 css - html 페이지를 구성하는 '뼈대' 라고 보면 된다. head 와 body로 구성되어 있으며, head에는 페이지의 속성, body에는 페이지의 내용이 들어간다. 태그들마다 다양한 기능을 갖고 있지만, 외우려고 애쓰지 말고 필요한 것들은 구글링해서 가져다 쓰자. - css html의 내용을 꾸밀때 사용한다. head 안에 로 들어가며 지칭할 이름이 필요하다. html 과 css 사용해보기 : 간단한 로그인 페이지 왼쪽 결과를 보고 먼저 어떤 기..

5강. 파이썬 기초 - 변수 : a = 3, b = 'ok', result = True 또는 False (boolean 형) - 자료형 - 리스트 : a_list = [] a_list.append(1) # 리스트에 값을 넣는다 a_list.append([2,3]) # 리스트에 [2,3]이라는 리스트를 다시 넣는다 # a_list의 값은? [1,[2,3]] # a_list[0]의 값은? 1 # a_list[1]의 값은? [2,3] # a_list[1][0]의 값은? 2 - 딕셔너리 : a_dict = {} a_dict = {'name':'bob','age':21} a_dict['height'] = 178 # a_dict의 값은? {'name':'bob','age':21, 'height':178} # a_d..

1강.