코딩공부31 코드잇 학습일기 Day10. 링크 상대 주소, url 프래그먼트, 새 탭 열기, URI 스킴 오랜만에 다시 돌아온 코드잇 학습일기! 지난 주에도 한 개 쓰고 일주일만인데 엄청 오랜만인 것처럼 느껴진다. (왜지?) 오늘은 링크에 대해서 공부했다. 링크는 태그로 만들 수 있는데, 퍼블리싱을 공부해 본 적이 있다면 정말 필수적으로 공부해야 하는 기초 태그라고 할 수 있다. 링크를 사용하지 않고서는 웹사이트를 만드는 것이 거의 불가능하니까... 그래서 오늘 들은 강의들은 익숙한 내용들이 많았고, 다시 한 번 아는 내용들을 복습할 수 있었던 좋은 기회였다. 어제는 회사 업무가 바빠서 코드잇 강의를 듣지 못했다. 적어도 하루에 강의 한 개 정도는 듣자는 것이 목표이지만, 지키지 못했다고 해서 동기부여에 부정적인 영향을 끼치는 건 더 좋지 않을테니까... 정 못하겠으면 '바빠서 어쩔 수 없었어' 하고 주말에.. 2023. 4. 4. 코드잇 학습일기 Day9. HTML 개념과 구조, 코멘트(주석) 작성 방법 오랜만에 다시 돌아온 코드잇 학습일기~! 2월에 학습일기 챌린지에 참여해서 50,000 네이버 포인트를 받았다. 챌린지가 끝날 줄 알고 있었는데 3월에도 동일한 조건으로 학습일기 챌린지를 진행한다는 사실을 얼마 전에 알았다. 으아, 진작 알았으면 또 참여 하는건데 아쉽...ㅠㅠ 그래서 4월에도 챌린지를 하지 않을까 하는 기대와 그것을 준비하는 워밍업으로 3월 마지막주에 학습일기를 하나 써보기로 했다. 오늘 공부한 내용은 프론트엔드 과정 중 하나인 HTML 핵심 개념 토픽이다. 기초적인 내용이라 부담없이 복습하는 기분으로 듣고, 또 모르는 내용이 나오면 블로그에도 정리해두려고 한다. HTML 의미 HTML은 Hypertext Markup Language의 약자이다. 첫번째 단어인 하이퍼텍스트(Hyperte.. 2023. 3. 27. 내용에 꺽쇠 기호(<>) 텍스트 넣는 방법 화면에 태그와 같은 형태의 꺽쇠 기호() 넣는 방법에 대해서 알아보자. 다른 말로는 '홑화살괄호'라고도 부른다. html에서 내용을 작성할 때 html 태그와 같은 형태의 , , 등을 텍스트로 넣고 싶을 때가 있을 것이다. 예를 들어 아래와 같은 코드를 작성하였다고 가정해보자. html 태그의 종류 태그는 내가 표시하고 싶은 대상의 양쪽에 꺽쇠()를 사용해서 태그 이름을 적어주면 된다. 대표적인 태그들은 아래와 같다. - 태그는 heading의 약자로 제목이다. - 태그는 paragraph의 약자로 하나의 문단을 만들 때 쓴다. - 태그는 bold의 약자로 글씨를 굵게 표현한다. 위 코드를 화면으로 그리면 웹 브라우저에서 , , 태그를 설명하는 부분이 제대로 보이지 않는다. 이유는 이 텍스트들을 html.. 2023. 3. 9. 코드잇 학습일기 Day8. rejected 상태에서 실행하는 콜백, then 메소드 이해 코딩인강 코드잇의 챌린지 이벤트, 마지막 학습일기 포스팅이다. 회사를 다니며 학습일기를 써야한다는 게 부담스럽게 느껴질 때도 있었지만 그래도 덕분에 하루에 다섯개씩 강의를 들을 수 있었다. 왠지 마지막이라고 하니까 시원섭섭한 기분이 든다. 나중에 회사 업무에 여유가 생기면 꼭 이벤트가 아니더라도 셀프 챌린지를 해봐도 좋겠다는 생각이다. 오늘 공부한 내용은 rejected 상태에서 실행할 콜백을 지정하는 방법과 then 메소드에 관한 것이었다. 자바스크립트를 공부하는 분들을 위해 포스팅으로 정리해 보도록 하겠다. Promise 객체가 Rejected 상태일 때 실행하는 콜백 지정 Promise 객체가 갖는 상태값은 pending, fulfilled, rejected - 총 3개이다. 더 자세히 알고 싶다면.. 2023. 2. 22. 코드잇 학습일기 Day7. Promise 객체와 Promise Chaining 벌써 코드잇 학습일기 챌린지 마지막 주가 되었다. 시간이 정말 빠른 것 같다. 그리고 한달이 다 되어가는데 아무리 회사 업무가 바쁘다지만 나는 토픽 하나도 제대로 끝내지 못하고... 그렇다고 자바스크립트 웹 기본기를 잘 다졌냐고 물으면 그것도 자신이 없고... 솔직히 조금 속상하다. 그래도 포기하지 않으면 언젠가는 잘 할 수 있게 되리라 믿으며, 오늘도 코딩 인강 시작! fetch 함수는 promise 객체를 리턴한다고 한다. 그렇다면 promise 객체는 무엇일까? Promise 객체란? 어떤 작업에 대한 '상태 정보'를 가지고 있는 객체이다. 예를 들어 fetch 함수를 보내면 성공할 수도 있고, 실패할 수도 있는데 이러한 정보들이 promise 객체에 저장된다. promise 객체는 3개의 상태 정.. 2023. 2. 20. 코드잇 학습일기 Day6. Ajax, PATCH/HEAD 메소드, fetch함수, 동기/비동기 실행 오늘 아침은 코드잇 강의로 시작~ 학습일기를 시작한지가 엊그제 같은데 벌써 여섯번째 학습일기이다. 3주가 지났다니... 시간이 정말 빠르다. 오늘은 다양한 메소드와 fetch함수, 비동기 실행의 개념에 대해서 배웠다. Ajax란 무엇인가? Ajax는 Asynchronous JavaScript And XML의 줄임말이다. 이 기술은 웹 브라우저가 현재 페이지를 그대로 유지한 채로 서버에 리퀘스트를 보내고 리스폰스를 받아, 새로운 페이지를 로드하지 않고도 변화를 줄 수 있도록 한다. 네이버 지도에서 특정 좌표를 클릭했을 때 전체 페이지가 로드되는 것이 아니라, 해당 좌표의 업체 정보만 추가로 보여지는 것을 예시로 들 수 있다. PATCH 메소드 역할 기존의 데이터를 수정할 때 사용한다. PUT과는 차이점이 .. 2023. 2. 15. 코드잇 학습일기 day5. 자바스크립트 Status Code와 Content-Type 헤더 지난 포스팅에서는 Request(요청)에 대해서 알아보았다. 이번 포스팅에서는 Response(응답)에 대해서 정리해보려고 한다. Response의 구조도 Head, Body로 이루어져있는데, Head에는 Response에 대한 부가 정보가 담겨 있고, Body에는 실제 데이터(주로 JSON 데이터)가 담겨 있다. Status Code란 무엇인가? 웹 브라우저의 개발자 도구 > Network 탭 > 특정 항목 선택 > General 부분에서 Status Code를 찾을 수 있다. Status Code는 우리말로 '상태 코드'라고 한다. 아래 이미지의 경우 Status Code: 200 이라고 되어있는데, 200은 정상 처리를 했다는 의미이다. 만약 정상 처리되지 못했다면 다른 숫자를 보게 된다. 대표적인.. 2023. 2. 13. 코드잇 학습일기 day4. 각각의 Request 보내는 방법 오늘은 출근길에 코드잇 강의를 7개 들었다. 그리고는 '이따가 출근해서 시간날 때 블로그에 학습일기 써야지' 하고 생각했는데, 이것저것 각종 업무들을 처리하다보니 퇴근시간이 10분밖에 남지 않았다. 오늘은 저녁에 일정이 있어서 퇴근시간을 꼭 지켜야 하는 상황... 그래서 각각의 Request 보내는 방법만 간략하게 정리하고, 추가로 알고있으면 좋은 개념들은 다음 포스팅에 다시 쓰는걸로...! GET Request 보내기 이제 GET Request 보내는 방법은 넘나 익숙해서 안보고도 쓸 수 있을 것 같다. fetch('url') .then((response) => response.text()) .then((result) => { console.log(result); }); POST Request 보내기 .. 2023. 2. 9. 코드잇 학습일기 day3. JSON 데이터 자바스크립트 객체 변환, Request와 메소드 종류 한 주의 시작은 코드잇으로~ 원래 하루에 강의 한개씩은 꼬박꼬박 듣고 있었기 때문에, 습관적인 면에서는 어렵지 않지만... 하루에 다섯개 강의를 들어야 하는 것은 조금 부담이다. 그래도 일주일에 두 번 정도라면, 업무가 바쁘지 않은 날이나 점심시간을 이용해서 들을 만 하다. JSON 데이터 자바스크립트 객체로 변환하기 어떤 변수의 데이터 타입을 확인할 때에는 typeof 연산자를 사용하면 된다. 위와 같이 typeof 연산자를 사용하면 JSON 데이터가 string 타입이라는 것을 알 수 있다. 그런데 데이터가 string 타입이라면 작업하는 것이 쉽지 않다. 다행히도 string 타입의 JSON 데이터는 그대로 자바스크립트 객체로 변환할 수 있다. 위와 같은 JSON 데이터에 parse 라는 메소드를 .. 2023. 2. 6. 코드잇 학습일기 day2. 웹환경 이해하기 - web, URL, https 오늘 학습일기는 자바 스크립트와 관련된 내용은 아니긴 하지만... 그래도 자바스크립트 웹기초 커리큘럼에 있는 내용이기도 하고, 학습일기가 자연스럽게 이어지는 것이 좋을 듯 하여, JavaScript 카테고리에 포스팅을 하도록 하겠다. 오늘도 어김없이 코드잇 공부~ 출근길을 이용해서 빠르게 강의 5개를 들었다. 코드잇 강의는 길지 않아서 출퇴근길, 점심시간 등 여유시간이 생겼을 때에 부담없이 들을 수 있다. 웹(WEB)은 무엇인가? 웹은 World Wide Web의 약자로, 인터넷에 연결된 컴퓨터를 통해 사람들이 정보를 공유할 수 있는 공간을 말한다. 하이퍼 텍스트 형식으로 표현된 인터넷의 다양한 정보를 효과적으로 검색할 수 있는 시스템이며, 전 세계적으로 가장 널리 보급되어 있다. URL은 무엇인가? U.. 2023. 2. 2. 이전 1 2 3 4 다음
