개발 관련 기록

1. 학습 목표 1) 웹개발 종합반 5주차 완강 및 작성 2) SQL 강의 완강  2. 학습 내용 1) 실습 환경 :  1~3강[VSCode, 웹브라우저(Chrome), Firebase] 4~8강[Github], 9강[Python] / SQL[DBeaver] 2) 학습 내용 : 웹week5 / SQLweek3    3. 학습 내용 외 기록1) HTTP / HTTPS(1) HTTP(Hyper Text Transfer Protocol)-서버/클라이언트 모델을 따라 데이터를 주고 받기 위한 프로토콜-인터넷에서 하이퍼텍스트를 교환하기 위한 통신 규약으로, 80번 포트를 사용따라서 HTTP 서버가 80번 포트에서 요청을 기다리고 있으며, 클라이언트는 80번 포트로 요청을 보내게 된다.(2) HTTPS-HTTP에 ..

1. 학습 목표 1) 팀소개 페이지 프로젝트 발표 2) 웹기초 강의를 듣고 웹에 대해 이해 (RestAPI, 클라이언트/서버, frontend/backend 등) 2. 학습 내용 1) 실습 환경 : VSCode, 웹브라우저(Chrome) / Github, 터미널 2) 학습 내용 : 미니프로젝트(KPT 포함) / 웹기초 특강(업데이트 필요)    3. 학습 내용 외 기록 4. 어려웠던 부분 / 의문점1) ERR_FILE_NOT_FOUND4주차 추억앨범 실습하다가 console에서 이 에러가 발생했다. 이미지 파일 있는 주소가 사라졌나? 혹은 이 프로젝트 위치가 인식이 안되나? 싶었는데 중간에 코드를 몇 번 수정했어서 강사님 코드(정답 코드)로 진행하려고 복붙한 것이 문제였다. 내 firebase confi..

* 실습 환경 : VSCode, 웹브라우저(Chrome), Firebase* 활동 기간 : 09.30. ~ 10.07. 1. 와이어 프레임1) 기존 와이어프레임2) 페이지 추가2. 내가 구현한 것1) 멤버 소개 페이지 템플릿(member.html)(1) 상단 구현(header) : 팀 소개 버튼과 멤버 소개 버튼은 클릭 시 해당 페이지로 이동(2) 등록 박스(postingbox) : 사진 링크, 이름, MBTI, 등 정보 입력 후 등록 버튼 클릭 시 카드 생성(3) 멤버 카드(membercards) : 수정 버튼(연필), 삭제 버튼(휴지통) 기호 넣고, 코딩'치킨'이기에 달걀 그림으로 디자인. 가시성 높이기 위해 줄(line) 추가 2) 멤버 상세 페이지(memdetail.html)(1) 상세 페이지 영..

1. 학습 목표 1) 미니 프로젝트 멤버 소개 상세 페이지 작성(10/3) 오류 수정(10/4) 2) 웹개발 4주차 완강 2. 학습 내용 1) 실습 환경 : VSCode, 웹브라우저(Chrome),Firebase / Github, 터미널 2) 학습 내용 : 웹개발 4주차 week4 / 상세페이지 제작    3. 학습 내용 외 기록 4. 어려웠던 부분 / 의문점1) [멤버 소개 상세 페이지 작성 과정] member.html 페이지에서 카드 확대 버튼 클릭시 memdetail.html(상세페이지)로 id 값을 보내고 그 값을 docs와 비교해서 어떤 팀원의 내용인지 일치시키고 출력하는 부분을 구현하려고 했다. 근데 계속 오류가 나서 id가 안 보내지는 건가 했는데 튜터님께 여쭤보니 정의가 안 되어 있어서 발..

1. 학습 목표 1) 미니 프로젝트 멤버 소개 페이지 템플릿 제작하기 2) 3주차 강의 완강하고 기록 2. 학습 내용 1) 실습 환경 : VSCode, 웹브라우저(Chrome) / Github, 터미널 2) 학습 내용 : week3 / 멤버페이지 - 템플릿과 JQuery 등록 부분 작성    3. 학습 내용 외 기록1) 줄바꿈 : 위아래 공백 있는 줄바꿈 : 공백 없는 줄바꿈 : 두 태그 사이에 있는 내용이 스페이스바,엔터 모두 반영되어 화면에 그대로 보여진다. 4. 어려웠던 부분 / 의문점1) 멤버 소개 페이지의 카드 등록 부분을 작성하는데 자꾸 카드가 안 생겨서 이것저것 해보았다. value 값 받아서 append 할 때 옆에 텍스트가 없어야 하나 싶어서 텍스트 부분(이름: , MBTI: ...) 을..

1. 학습 목표 1) 미니 프로젝트 멤버 소개 페이지 템플릿 제작하기 2) 진행 상황 Github에 공유하기 2. 학습 내용 1) 실습 환경 : VSCode, 웹브라우저(Chrome) / Github, 터미널 2) 학습 내용   전체적인 틀은 실습과 유사하게 진행.   (1) 상단 제작 부분은 Bootstrap의 Headers에서 원하는 헤더와 유사한 것을 찾아 필요 없는 부분은 삭제하고 style을 수정.   (2) 멤버 카드 등록 부분은 Bootstrap의 Floating labels를 참고하여 제작. 사진 업로드 부분 위에 추가하여 "사진 업로드" 라는 텍스트를 클릭하면 내 컴퓨터의 사진을 업로드할 수 있도록 함. -> loadFile(input) 함수  (3) 멤버 소개 카드 부분은 Bootstr..

1. 학습 목표 1) Javascript, JQuery 기본 문법 이해하기 2) Git 에 대해 이해하기 3) 미니 프로젝트 - 팀원 소개 구상하기 2. 학습 내용 1) 실습 환경 : VSCode, 웹브라우저(Chrome), 터미널, Github 2) 학습 내용 링크 : week2_spartflix / week2_JS,JQuery / git    3. 학습 내용 외 기록 4. 어려웠던 부분 / 의문점1) Javascript 실습할 때 결과는 잘 출력되지만 console에 "Live reload unable" 오류가 같이 뜨는데 이게 무엇인지 확인해봐야 5. 주의할 부분 / 중요 내용 6. 다음 학습 내용1) JQuery 적용하기2) Fetch 적용하기3) Firebase 이해하기 7. 회고git 관련 내..

1. 학습 목표 1)웹의 작동 원리와 웹을 개발하기 위해 배워야 할 것을 알 수 있다. 2)웹의 뼈대인 HTML과 꾸미기인 CSS를 이해하고 사용할 수 있다. 3)부트스트랩을 활용하여 웹을 다양하게 구현할 수 있다. 2. 학습 내용 1) 실습 환경 : VSCode, Chrome 2) 학습 내용 링크 :  week1   3. 학습 내용 외 기록 1) , , 차이 : 영역구분 목적 : 텍스트 입력 목적 : 꾸미기 목적, : 블록요소  => 는 를 포함 가능하지만 반대는 불가능. : 인라인 요소, 줄바꿈 안 됨X 2) 주석 처리하는 방법▶ style 태그안 주석 /* */ 한줄~ 여러줄 주석 가능▶ scrpt 태그안 주석 // 한줄 주석 사용 /* */ 여러줄 주석 가능▶ body 태그안 본문 주석 ..

1. 학습 목표 1) SQL 개념 이해 및 조회(SELECT), 조건(WHERE) 학습  2) SQL 숫자 연산, 범주별 연산(GROUP BY), 정렬(ORDER BY) 학습 3) 문자 포맷 가공(REPLACE, SUBSTRING, CONCAT), 조건 변경(IF, CASE), 그룹화 적용 학습 2. 학습 내용 1) 실습 환경 : DBeaver 2) 학습 내용 링크 week1 / week2 / week3    3. 학습 내용 외 기록 1) 데이터베이스 내 테이블 검색 (표준 SQL은 아님.)show tables;show tables like 'c%'; // c로 시작하는 테이블 검색 4. 어려웠던 부분 / 의문점 5. 주의할 부분 / 중요 내용 * SQL 작성 팁1) 어떤 테이블에서 데이터를 뽑을 것..

1. SQL 기본 명령어1) Database 생성CREATE DATABASE DB이름;2) Table 생성CREATE TABLE 테이블이름 (       컬럼1 데이터타입,       컬럼2 데이터타입,      ...)3) 데이터 조회(SELECT)SELECT 컬럼1, 컬럼2, ... FROM 테이블이름; * WHERE : 조건문 * ORDER BY : 정렬 (DESC 내림차순, ASC 오름차순) * LIMIT : 데이터(행) 개수 제한4) 데이터 삽입(INSERT)INSERT INTO 테이블이름 (컬럼1, 컬럼2, ...) VALUES (값1, 값2, ...);5) 데이터 수정(UPDATE)UPDATE 테이블이름 SET 컬럼값 변경 WHERE 조건;6) 데이터 삭제(DELETE)DELETE FROM ..