Hello World!

------- 개발 블로그를 티스토리로 옮기며 기존의 네이버 블로그에 작성한 내용을 옮겼습니다. https://blog.naver.com/0yeonjae2/222422833582 ------- 실질적인 수업이 끝난 후부터 프로젝트의 최종본을 제출하기 전까지의 활동을 정리했다. 수정할 것이 없을 거라 생각했는데 생각보다 많았다. (동영상은 네이버 블로그를 통해 볼 수 있습니다.) js 코드의 간결화 js의 문법을 배우기 전 하나하나 상황을 다 고려해서 거진 400줄이나 되는 양의 코드를 사용해서 앨범 페이지 변화와 공지사항의 변화를 표현했었다. 이 부분을 코드의 간결성을 위해 수정해야겠다고 마음먹고 있다가 드디어 작업했다 앨범 페이지에 적용되는 js 코드만 거진 450줄을 제거하고 130줄 정도로 간결화하..

------- 개발 블로그를 티스토리로 옮기며 기존의 네이버 블로그에 작성한 내용을 옮겼습니다. https://blog.naver.com/0yeonjae2/222376136991 ------- 이론 복습하기- 최신 자바스크립트 문법 4 1. 라이브러리 : 웹/앱에서 많이 사용되는 기능들을 재사용할 수 있는 코드로 구현해 놓은 것 (누군가 만들어놓은 코드들을 가져다가 사용할 수 있음.) 상황별 JS 라이브러리들은 다음과 같다. ①데이터 시각화(지도, 네트워크, 차트 그리기) : D3.js , Chart.js , leaflet.js ② DOM 조작 : jQuery ③애니메이션 효과 : GSAP, Anime.js ④수식, 날짜 처리 : Date.js ⑤Ul 컴포넌트 : React.js 2. Ajax : 브라우..

------- 개발 블로그를 티스토리로 옮기며 기존의 네이버 블로그에 작성한 내용을 옮겼습니다. https://blog.naver.com/0yeonjae2/222364167997 ------- 이론 복습하기-최신자바스크립트 문법 3 1 .DOM :문서 객체 모델(DOM)은 메모리에 웹 페이지 문서 구조를 표현함으로써 스크립트 및 프로그래밍 언어와 페이지를 연결한다. 이때 스크립트는 주로 Js를 의미한다. DOM은 문서를 논리 트리로 표현한다. 트리의 각 브랜치는 노드에서 끝나며, 각 노드는 객체를 가진다. DOM 메서드를 사용하면 프로그래밍적으로 트리에 접근할 수 있다. 이를 통해 문서의 구조, 스타일, 콘텐츠를 변경할 수 있다. 노드는 이벤트 처리기를 포함할 수 있다. 이벤트가 발생한 순간, 해당 이벤..

------- 개발 블로그를 티스토리로 옮기며 기존의 네이버 블로그에 작성한 내용을 옮겼습니다. https://blog.naver.com/0yeonjae2/222353308854 ------- 이론 복습하기-최신 자바스크립트 문법 2 (with CodeSandBox) (1) 제어문 : 조건에 따라 코드 블록을 실행하거나 반복 실행할 때 사용한다. 제어문을 사용하면 코드의 실행흐름을 인위적으로 제어할 수 있는데, 코드의 실행 순서의 변화가 일어나므로 가독성이 떨어지고, 오류가 발생할 확률이 높다. 따라서 요즘은 if, for문 대신 고차함수를 사용해 프로그래밍하는 것을 권장한다. ○조건문 : 주어진 조건식에 따라 코드 블록의 실행을 결정한다. ① if, else if, else문 (조건에 따라 단순히 값을..

------- 개발 블로그를 티스토리로 옮기며 기존의 네이버 블로그에 작성한 내용을 그대로 옮겼습니다. https://blog.naver.com/0yeonjae2/222345498120 ------- 이론 복습하기 - 최신 자바 스크립트 문법 1 (With CodeSandBox) ​ (1) 변수 1. 변수 : 하나의 값을 저장하기 위해 확보한 메모리 공간 자체 또는 그 메모리 공간을 식별하기 위해 붙인 이름, 즉 값의 위치를 가리키는 상징적인 이름이다. 변수가 값 자체를 가리키는 이름이 아니라는 것이 중요하다. 2. 변수 선언하기 변수 이름 : 메모리 공간에 저장된 값을 식별할 수 있는 고유한 이름 변수 값 : 변수에 저장된 값 할당 : 변수에 값을 저장하는 것 참조 : 변수에 저장된 값을 읽어 들이는 ..

------- 개발 블로그를 티스토리로 옮기며 기존의 네이버 블로그에 작성한 내용을 그대로 옮겼습니다. https://blog.naver.com/0yeonjae2/222326625193 [웹프로그래밍기초] 7~8주 차 개발일지 +) 22.01.28. 개발 블로그를 티스토리로 옮겼습니다! -> https://0yeonjae2.tistory.com/ 2주 동안은 중... blog.naver.com ------- 2주 동안은 중간고사 공부로 블로그에 개발일지를 작성하지 못했다. 며칠 전 시험이 끝나 2주간의 시도들을 정리해 보고자 한다. 아래 사진은 최종 결과물이다! 제출일에 폰트 설정을 바꾸고 전체적으로 다듬었는데 로그인 회원가입 옆 아이콘 위치 조절을 깜빡 잊고 제출했다... 음원사이트 특성상 1시간마다 ..

------- 개발 블로그를 티스토리로 옮기며 기존의 네이버 블로그에 작성한 내용을 그대로 옮겼습니다. https://blog.naver.com/0yeonjae2/222307647439 ------- 이론 복습하기 1. 중앙 정렬하기 : 중앙 정렬하고 싶은 태그에 width 속성을 부여하고 margin : 0 auto; 설정하기 2. One True 정렬 레이아웃 ①행을 구분해서 각각의 행에 이름 붙여주기 ②열을 구분하기 ③레이아웃 구성하기 -수평 레이아웃 구성하기 :하위 태그에 float 속성을 지정하고, 상위 태그에 overflow : hidden; 적용하기 이때 overflow : hidden 은 하위 태그의 내용이 상위 태그의 범위를 넘어간다면 넘어간 부분을 보이지 않도록 하는 기능이다. 실습하기..

------- 개발 블로그를 티스토리로 옮기며 기존의 네이버 블로그에 작성한 내용을 옮겼습니다. https://blog.naver.com/0yeonjae2/222298787887 ------- 이론 복습하기 1. position : relative & position : absolute & position : fixed relative : 기본값 / 겹치지 않게 위치시킴 absolute : 상위요소 내에서 위치를 잡음 fixed : 고정됨(주로 헤더에서 사용) 2. align-items와 justify-content를 이용한 정렬 display : flex; align-items : center; justify-contents: center; ▲가운데 정렬 / 배열하고자 하는 것의 상위 요소에 적용한다 ..

------- 개발 블로그를 티스토리로 옮기며 기존의 네이버 블로그에 작성한 내용을 그대로 옮겼습니다. https://blog.naver.com/0yeonjae2/222292135765 ------- HTML5 기본 태그 1-1 목록 태그 (1) 순서가 있는 목록 : ordered list : list (2) 순서가 없는 목록 : unordered list : list 1-2 테이블 태그 : 표 삽입 : 표의 제목 : 열의 제목으로 구성된 행의 집합 : 표의 본문 : 열의 요약으로 구성된 행의 집합 : 표의 행 삽입 :표의 제목 제목 셀 생성 :표의 일반 셀 생성 표의 셀을 병합할 때는 rowspan이나 colspan을 작성하고 병합할 개수를 적어주면 된다. 는 행을 숫자만큼 합친다는 뜻이고, 는 열을 ..

------- 개발 블로그를 티스토리로 옮기며 기존의 네이버 블로그에 작성한 내용을 그대로 옮겼습니다. https://blog.naver.com/0yeonjae2/222284994814 ------- 1. 경로 현재 하고 있는 작업 파일에서 다른 위치에 있는 파일을 사용해야 하는 경우가 있다. 이때 경로를 설정해서 프로그래밍을 한다. 1-1 루트 디렉토리 = 최상위 디렉토리 일반적으로는 c 드라이브의 루트 디렉토리는 c:/이다. 1-2 절대경로와 상대경로 절대경로는 PC의 C 드라이브를 기준으로 하는 파일의 고유한 경로이다. 상대경로는 지금 위치한 디렉토리를 기준으로 하는 파일의 상대적인 경로이다. 1-3 경로 설정하기 ./는 현재 위치에서, ../는 현재 위치에서의 상위 디렉토리를 뜻한다. 2. Git..