스파르타코딩클럽18 [리액트 입문주차] 1-1 오리엔테이션 ~ 1-4 CRA 1-1 오리엔테이션 1. React란 무엇인가 - UI를 빌딩하기 위한 자바스크립트 라이브러리 - SPA 기반의 프론트엔드 프레임워크 중 하나 - 컴포넌트 단위의 독립적인 블록을 이용한 방법 - AngularJS, VueJS 보다 월등한 인기 2. SPA(Single Page Application) - 한 개의 페이지로 이루어진 애플리케이션, M(Multi)PA과는 상반된 개념 - 애플리케이션과 비슷한 UX를 제공해줌 - 기존 문제의 문제점 : 페이지가 갱신될 때마다 리렌더링 발생 - 특징과 장점 > 딱 한 페이지로 구성된 웹 앱 > 서버에 1회 리소스 요청 > 그 이후에는 데이터만 받아와서 기존 페이지를 수정해주는 방식 - 단점 : SEO에는 약함 SEO(Search Engine Optimization.. 2023. 6. 23. [웹개발 종합반] 5주차 정리 및 마무리 5-2 AWS 가입하기 및 보안설정하기 AWS 루트 계정으로 가입하기 AdmiistratorAccess 체크하여 사용자 그룹 생성 IAM 사용자 생성 사용자 그룹에 사용자 추가 IAM 사용자로 계속 사용 -> 과금 예방 5-3 ~ 5-6 [버킷리스트] 프로젝트 실습 5-7 ~ 5-10 [팬명록] 프로젝트 실습 5-11 og 태그 5-12 내 프로젝트를 서버에 올리기 로컬 서버 -> 클라우드 서버 언제나 요청에 응답할 수 있도록 항상 켜져있고, 모두가 접근할 수 있는 공개 주소를 가지는 컴퓨터가 있어야 함 AWS(Amazon Web Service)를 통해 컴퓨터 빌리기 빌린 컴퓨터에 내 코딩 파일을 업로드하고 실행시키기 AWS Elastic Beanstalk 서비스 5-13 AWS Elastic Beans.. 2023. 5. 22. [웹개발 종합반] 4주차 정리 4-2 Flask 시작하기 - 서버 만들기 (1), (2) 가상환경 생성하기 Flask 패키지 설치하기 #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) 4-4 Flask 시작하기 - HTML 파일 주기 flask의 기본 폴더 구조 templates 폴더 - html 파일들 app.py 파일 HTML 파일 불러오기 flask 내장 함수 render_template 이용 return render_template('index.html') 4-5 .. 2023. 5. 22. [웹개발 종합반] 3주차 정리 3-6 파이썬 패키지 설치하기 가상환경 venv - 패키지를 담아두는 공구함 가상환경 구축 방법 해당 프로젝트 폴더로 이동 (window) 터미널에서 python -m venv venv 엔터 vs code 우측 하단에서 인터프리터 venv로 변경 후 새 터미널 열기 (venv) 표시 확인 파이썬 패키기 requests 설치 pip install requests 3-7 패키지 사용해보기 requests 패키지 - fetch와 유사 서울시 대기 openAPI 에서 모든 구의 미세먼지 값 출력하기 import requests # requests 라이브러리 설치 필요 r = requests.get('http://spartacodingclub.shop/sparta_api/seoulair') rjson = r.js.. 2023. 5. 21. [웹개발 종합반] 2주차 정리 2-1 2주차 오늘 배울 것 Javascript : 웹을 움직이게 하는 코드 jQuery : html 뼈대를 선택하여 쉽게 조작할 수 있음 Fetch : 짧은 코드로 요청을 보내고 받아올 수 있음 2-2 Javascript 맛보기 브라우저가 알아들을 수 있는 언어 자바와 자바스크립트의 차이 : 아무 상관 X like 바다와 바다코끼리 2-3 Javascript 기초 문법 배우기 list : let a = [1, 2, 3, 4] a[0] => 1 dictionary : let b = { 'name': '영수', 'age' : 27 } => key, value 쌍 b['name'], b['age'] => 영수, 27 list 속 dictionary : let c = [ { 'name': '영수', 'age'.. 2023. 5. 18. [웹개발 종합반] 1주차 정리 1-2 웹 브라우저 원리 왜 내 네이버 페이지만 고칠 수 있는가? 인터넷을 꺼도 페이지는 그대로 있다. 새로고침을 하면 처음으로 돌아간다. 즉 브라우저의 역할이란, 요청해서 받은 것을 그대로 보여주는 것 1-9 자주 쓰이는 CSS 연습하기(2) 정렬 단축키 : Shift + Alt + F 1-17 내가 만든 웹 페이지 배포해보기(1) 정적 웹페이지 github를 이용한 배포 2023. 5. 18. 이전 1 2 다음
