전체 글

프론트엔드, 백엔드, 앱, 웹 등을 다루는 Jukrap의 프로그래밍 및 개발 블로그. 사실 일상도 다룸.
서론 어제도 많았는데 오늘도 많다. 이러다가 줄줄이 밀릴지도 모르겠다. 그래도 의미없는 내용은 아닌 것 같다. 어제가 기초였다면 오늘은 프로젝트의 핵심이 되는 요소들이 많기 때문이다. 기초가 없는 사람으로서 이런 건 확실하게 익히고 가는 게 맞다. 물론 그렇다고 해도 너무 많다. 아무래도 파트1, 2가 분리되어서 올라가지 않을까 싶다. 이번 일자는 자바스크립트 기초 - 객체와 빌트인 객체 그리고 매커니즘이다. 객체 (Object) 자바스크립트는 객체(object) 기반의 스크립트 언어이며 자바스크립트를 이루고 있는 거의 모든 것이 객체이다. 원시 타입을 제외한 나머지 값들(함수, 배열, 정규표현식 등)은 모두 객체이다. 또한, 객체는 키(Key)과 값(Value)으로 구성된 프로퍼티(속성)들의 집합이다...
서론 할 말은 없다. 워낙 급하기 때문에 나머지 말은 사족에 다 몰아서 적도록 하겠다. 강의는 산더미이고, 정리할 것 또한 산더미이다. 지금 당장 안 끝내면 두고두고 밀릴 것이 뻔하다. 이번 일자는 자바스크립트 기초 - 기본 및 control flow이다. 연산자 연산자(Operator)는 하나 이상의 표현식을 대상으로 산술, 할당, 비교, 논리, 타입 연산 등을 수행해 하나의 값을 만든다. 이때 연산의 대상을 피연산자(Operand)라 한다. 또한, 다양한 종류의 연산자가 존재한다. - 단항 연산자, 산술 연산자, 관계 연산자, 이진 논리 연산자, 삼항 연산자, 할당 연산자, 옵셔널 연산자, 쉼표 연산자 등등... 산술 연산자 (Arithmetic operator) 피연산자를 대상으로 수학적 계산을 통..
본 글은 추가적인 정리 및 별도의 글로 분리할 주제 및 별도로 해야 할 일에 대해 적어놓는 공간입니다. 미완료 S급 기업에 취업! [CSS] 그리드 [JS] 화살표 함수 표현식 [JS] spread 연산자(...) [JS] 콜백 함수 [JS] 정규 표현식, Array 객체, 컬렉션, JSON, 국제화 [Tistory] 블로그 디자인 수정 [HTML/CSS] 간단한 웹디자인 예시 해보기 [JS] 노션 클로닝 [GIT] 깃 및 깃허브 관련 정보글 쓰기 완료 [CSS] 플렉스박스 ...없음
서론 아무래도 하늘이 날 버린 것 같다. 작성하던 9일차 글이 날라갔다. 😱 인터넷이 연결되어 있는 줄 알았는데 제대로 연결이 안 되어있던 탓이다. 이제 오늘 중으로 30000~50000자 정도를 전부 써야 TIL을 맞춰서 따라갈 수 있다. 살려ㅈㅜㅓ... 이번 일자는 자바스크립트 기초 - 데이터와 형태다. 메모리와 변수 메모리 데이터를 처리하는 과정에서 처리 흐름마다 값들을 기억해둘 필요가 있다. 컴퓨터는 데이터를 기억하기 위해 메모리를 활용한다. 메모리 데이터를 담아 기억하는 곳. 각 데이터마다 위치 주소값이 존재. 위치를 찾는데에는 메모리의 주소값이 사용. 즉, 메모리라는 것은 컴퓨터의 기억장치를 뜻한다. 이러한 메모리는 물리적으로 다양한 종류가 있으며, 용도면에서도 크게는 2가지 종류(주기억장치,..
서론 마침내 프로그래머스 데브코스에서의 자바스크립트 학습이 시작되었다. 그리고 나는 아직까지 그리드 정리를 마치지 못했다. 앞으로도 마치지 못할 것 같다. 농담이고 이 속도라면 React 학습에 들어갈 즈음이 돼서야 그리드 정리를 마치지 않을까. 그래도 오늘 공부할 내용은 문제의 그리드보다는 양이 적다고 할 수 있다. 오늘은 어제처럼 좀 일찍이 끝낼 수 있지 않을까 싶다. 이번 일자는 자바스크립트 기초다. 강의 목적 자바스크립트 학습의 근본적인 이유...? 1. 유저들의 불만사항을 해결하기 위해 서비스를 만든다. 2. 서비스를 만들기 위해 웹 개발을 배운다 3. 웹을 개발하기 위해 자바스크립트를 배운다! 파트별 학습 내용 [1부] 데이터 처리 - 변수, 형태, 함수, 실행. [2-1부] 인터렉션(inte..
서론 큰일 났다. 그리드를 아직 제대로 안 썼는데 7일 차로 넘어가는 TIL 글이다. 처음에는 그리드가 이틀 정도면 다 쓸 것이라고 생각했었는데, 생각보다 그리드 내용이 너무 방대해서 어떻게 해야 할지 감조차 안 온다. 그래도 7일차 내용을 써야 하니 열심히 쓰도록 하겠다. 그런데 하필 7일 차는 학습이라기보다는 지금까지 배운 내용을 총 망라해서 쓰는 쪽에 가까웠다. 그런 관계로 오늘 분량은 프로그래머스 데브코스 강사님께서 중간중간 언급하신 팁이나 개인적으로 중요하다고 생각한 내용 위주로 서술하도록 하겠다. 실습 내용은 정리해서 안 올리냐고 할 수도 있지만, 솔직히 이미 이전 일차들에서 설명한 내용들이 대부분이다. 그리고 그건 아무리 봐도 저작권에 걸릴 것 같다. 코드의 극히 일부라면 모를까, 한 움큼씩..
서론 일정이 너무나 밀렸다. 이럴 줄 알았으면 진작 마우스를 바꾸는 것인데, 다소 후회되는 감이 적잖다. 일단 오늘 분량은 적은 편이라고 하니 빠르게 진행하도록 하겠다. 이번 일자는 반응형 코드 학습이다. 적응형 웹 vs 반응형 웹 아무리봐도 비슷하게 들리는 두 용어. 그러나 이 둘은 명백히 다른 의미를 지닌 웹 사이트 제공 방식이다. 적응형 웹(Responsive Web Design) 접속하는 기기에 따라 PC용 웹사이트, 테블릿용 웹사이트, 모바일용 웹사이트를 따로 보여주는 기법이다. HTTP GET의 user-agent에서 사용자가 어떤 기기를 쓰는지 확인 후, 해당 기기에 맞추어서 해당 뷰포트에 최적화된 페이지로 넘겨준다. 여러 템플릿을 기반으로 하기에, 필요한 것만 다운로드 받으면 되기에 용량이..
서론 5일차에서 이어지는 CSS 학습이다. 사실 강의 자체는 5일차에 다 들었으니, 이것도 5일차라고 하는 게 맞지 않나 싶기도 하지만... 문제는 정리하고 추가로 공부하는 게 생각보다 많다는 점이다. 그리고 실질적으로는 바로 다음 날 올라왔어야 했는데, 여러 개인적인 사정으로 일주일이나 거의 미뤄진 뒤에 올라오게 되었다. 살다살다 usb 과전압으로 컴퓨터가 안 켜지고, 키보드&마우스가 고장나고, 감기 때문에 앓아누울 줄이야... 아무튼, CSS 공부 겸 TIL을 계속 이어가도록 하겠다. 오늘은 프로그래머스 데브코스의 강사님들도 중요하다고 말하신 그리드라는 내용이 나온다. 이번 일차는 CSS 학습이다. 표시 유형과 레이아웃 Display 없음 인라인 요소인라인 요소 블록 요소블록 요소 인라인-블록 요소인..
서론 Flexible Box module. 일명 flexbox라고 불리는 모델은 인터페이스 내의 요소 간 공간 배분과 각종 정렬 기능을 제공하기 위한 레이아웃 모델로 설계되었다. 쉽게 말하자면 요소들을 자유 자재로 옮겨 놓는, 그냥 레이아웃 배치 전용 속성이다. 개인적으로는 레이아웃 정렬 옵션 정도로 생각하고 있다. 첫 번째 div 두 번째 div 세 번째 div 네 번째 div 다섯 번째 div 여섯 번째 div 일곱 번째 div .mains { background-color : orange; border : solid 5px brown; margin : 15px; padding : 15px; display: flex; } .box1 { /* 다른 박스 번호들도 동일 */ background-color..
서론 5일차 프로그래머스 데브코스다. 오늘을 끝으로 HTML과 CSS의 기초는 끝난다. 실로 다이나믹한 학습 과정이다. 다만, 다음주에 바로 Javascript를 공부하는 것은 아니다. 크리스마스 주간&연말-연초와 겹치는 관계로 다음주는 쉰다. 뭘 공부해야 할까. 생각이 들기도 했는데. 또 고민해보면 지난 5일 동안 TIL을 쓰면서 넘겼던 부분이 몇 가지 있다. 그걸 써야겠다. 그리고 본격적인 학습에 들어가면 어려워질 자바스크립트 예습도 하는 것이 좋을 것 같다. 아니, 자바스크립트보다는 알고리즘 공부가 맞을지도 모르겠다. 어차피 자바스크립트를 어느 정도 쓸 줄 아니까, 기초나 자잘한 부분은 데브코스에서 배우고, 코드 운용인 알고리즘을 익히는 것이 맞으리라. 정리를 하면 생략하거나 부족했던 HTML/CS..
서론 4일차 pt.2 - 강의 시간이다. 참고로 pt.1은 특강 시간의 내용, pt.2는 강의 시간의 내용이다. 프로그래머스 데브코스 3일차를 끝나고 이제 4일차부터는 CSS에 대한 학습이 이뤄질 예정이다. 구조를 짜는 HTML에서 벗어나 내부적인 무언가를 채우는 CSS라니, 걱정도 되고 기대도 된다. 옛날에 CSS 만질 때 꽤 재미있었는데, 이번에도 부디 그랬으면 좋겠다. 참고로 CSS는 총 2일차로 구성될 예정이다. 아무래도 디자인 분야에 가깝다보니 그리 길지는 않다. 더 자세한 것은 아마 내 스스로 익히거나, 이리저리 부딛치면서 해보는 게 맞아보인다. 그리고 첨언하자면 원래는 제목1(h1)을 해당 시간에 배우는 영역으로 놓았었는데, 아무래도 그렇게 하다보니 하위 제목이나 리스트가 부족해지는 것 같다..
서론 4일차 pt.1 - 특강 시간이다. 참고로 pt.1은 특강 시간의 내용, pt.2는 강의 시간의 내용이다. 프로그래머스 데브코스에서 뭘 특강 할 것인지가 좀 궁금한데, 일단 듣자 하니 HTML과 관련된 특강이라고 한다. 아마 HTML 강의가 끝나면서 하는 모양이다. 그래도 지금까지 배운 걸 실전형에 맞춘다는 걸 보면 꽤 흥미로워 보인다. 프로그래머스 측에서 제공해주는 약간 꿀팁 위주의 강의로 보인다. 특강을 진행하시는 분은, 프로그래머스 클라우딩 어플리케이션 엔지니어링 데브코스(프로그래머스 클라우딩 웹앱 데브코스) 강사를 맡고 계신 김태영 강사님이다. 이번 일차는 HTML 특강 및 CSS이다. 스크린샷을 보며 화면 설계하기 body 태그 내부에 main, header, nav, div, sectio..
서론 이틀 동안 20,000자를 찍었다. 어제보다 오늘은 공부 분량이 더 많다. 일단 간소화할 부분은 따로 간소화해야 할 것 같다. 그리고 지난번처럼 실패하지 않을까 싶다. 일단 프로그래머스 데브코스 규정을 확인 후 소스 코드에 대해 고민 중에 있다. 전체를 올리면 안 된다는데 그러면 일부분 잘라서 올리는 것은 가능한 것일까? 일단은 일부분은 잘라서 올리는 것이 가능하다는 가정하에 본 글을 쓰도록 하겠다. 추후 문제가 된다면 삭제하도록 하겠다. 참, 위의 질문에 대한 프로그래머스 측의 답변이 몇 시간 뒤에 왔는데 소스코드 일부분을 자르거나 정리해서 올리는 건 가능하다고 한다. 그래서 이곳에 올라와있는 코드는 강의 자료의 일부만 올라와있거나, 내가 대대로 뜯어고친 거나, 상당히 보강한 것이 전부다. 고소미..
서론 글 3개 만에 13,000자를 넘겼다. 대충 글 하나당 3,000자~6,000자 정도 쓰고 있는 것 같다. 다행히 이번 일차는 좀 그러한 부담이 덜할 것 같다. 그리고 티스토리 자체 편집기를 쓰는 건 이번 일차로 끝내야 할 것 같다. 그냥 사용하려니 글자 색이 이상해져서 다크 모드에서 이상하게 보이는 문제가 있다. 사람들이 괜히 마크다운을 쓰는 게 아닌 것 같다. 역시 이럴 줄 알았으면 개츠비로 블로그를 만들어보는 건데. 프로그래머스 데브코스가 벌써부터 살짝 걱정된다. 쓰으으으으으읍. 일단 데브코스 강의에서 배운 내용과 내가 따로 조사한 내용을 합쳐서 TIL을 작성해 봤다. (즉, 내가 적고 있는 내용 일부는 따로 조사해서 추가한 내용들이다.) 이번 일차는 HTML 학습이다. HTML 기본 문법 H..
서론 분명 이 글을 집필한 날은 2일 차인데, 0일 차를 쓰다가 하루를 밀려 써버렸다. 사실 NULL일차가 올라온 시간도 2일 차 되는 날이니 사실상 3편을 2일 차에 올리는 꼴이다. 국비지원교육 듣는 사람으로서 실로 비상이 아닐 수 없었다. 그리고 알 수 없는 이유로 슬랙(Slack)이 뻗어버리면서 다른 비상상황이 벌어졌다. 아무래도 오늘의 운세는 그다지 좋지 않은 것 같다. 그래도 1일차에 배운 내용은 대강 기억이 나니 써보도록 하겠다. 사실 이번 글은 OT 내용이 영상으로 올려져 있어서 쓸 수 있는 것이기도 하다. 다만 프로그래머스 데브코스 오리엔테이션인 만큼, 이번 일차는 TIL보다는 IQ 86의 내가 추후 까먹지 않기 위한 데브코스 메모의 성격에 가까운 내용이 주를 이룰 것 같다. 오리엔테이션 ..
Jukrap
뒹굴뒹굴 공간