각종 학습 요약
-
Git 기초 - Git이란? & 설치 및 설정각종 학습 요약/Git 2022. 5. 3. 16:37
Git 기초 - Git이란? & 설치 및 설정 Git이란? 형상 관리 시스템. 파일이 수정된 버전이나 운영, 개발, 스테이징, 로컬 등의 상태에 따라 달라지는 개발환경을 유연하게 구성할 수 있도록 도와준다. 이전까지 많이 사용했던 SVN과 가장 큰 차이점은, 탈중앙식이라는 점이다. SVN은 메인 서버에서 모든 버전을 컨트롤 하지만(메인서버에 커밋하면 끝), Git은 각자의 Repository를 가지고 있고 로컬에서는 커밋하더라도 즉시 운영에 영향을 미치지 않기 때문에 자유롭게 구성하기 나름이다. 설치 윈도는 여기에서 받고, 맥이나 리눅스에서는 패키지매니저를 통해 설치하자. GUI / CLI 둘 다 사용하자. 설정 git을 사용할 유저 이름과 이메일을 입력해준다. git config --global use..
-
기초 리눅스 이해각종 학습 요약 2022. 5. 2. 16:50
리눅스 기초 CLI란? Command Line Interface. 말 그대로 커맨드라인 인터페이스를 가진 실행환경이다. Linux를 포함한 대다수의 Unix-like OS들은 CLI를 기본으로 사용한다. 명령어 주요한 명령어들은 다음과 같다. man : 배우는 입장에서는 가장 중요하다. 매뉴얼 보기! (ex: man pwd - pwd에 대한 매뉴얼 보기) pwd ls cd mv cp mkdir chmod rm cat head & tail more & less 에디터: vi, nano 등등... 하지만 가장 중요한 건 명령어를 사용하는 방법...을 알려주는 옵션이다! 모든 명령어 뒤에 --help를 입력해서 사용법을 알아보고 사용하는 습관을 들이도록 하자. 시간이 난다면 -r 옵션과 -f 옵션도 한번 보자..
-
flex layout에 대한 간단한 이해각종 학습 요약/Web 2022. 4. 30. 19:57
flex layout에 관한 작은 설명 이번주에 부트캠프에서 flex layout을 공부했는데(백엔드 과정이지만 기본적인 프론트 지식 정도는 쌓게한다는 의미에서 HTML/CSS도 보았다) 해당 내용이 매우 헷갈리다보니 스트레스를 받는 분들을 많이 만났다. "flex layout, 이거 사실 별로 중요한 거 아니야~"란 말을 들어도, 이해가 안되는 자신이 답답하게 느껴지는 그 스트레스가, 나는 충분히 상상이 되었다(그냥 내가 성격이 깝깝한 걸지도...). 그래서, 내가 가진 이해가 정확하지 않을지도 모르지만, 실제 활용하기에는 적당한 이해였기에 짧게 나눠보고자 한다. (제목은 flex 컨테이너에 대해 간단하게 이해시켜준다는 말이 아니라, 간단한 정도만 이해를 도와준다는 말이었던 것) 한가지, 용어 하나만 ..
-
HTML Page Layout : Flexbox로 레이아웃 잡기각종 학습 요약/Web 2022. 4. 28. 16:53
페이지 레이아웃 Flexbox로 레이아웃 잡기 display: flex 앞서 '기초 CSS의 이해 - 박스모델'에서 살펴봤듯, style 속성 display는 어떤 형식으로 보여질 건지, 박스모델의 display 방식을 결정하는 속성이다. Flex layout이란, 부모 엘리먼트의 박스모델을 display: flex로 속성값(강조한 이유가 있다, 일단 기억해두자)을 지정하고, 그 아래로 자식 엘리먼트들을 구성하는 레이아웃 구성 방식. Flex 요소(이하 '콘텐츠')들이 쌓이는 규칙 콘텐츠들은 기본적으로 수평으로 쌓인다('flex-direction의 기본값이 row다'라고 한다). 쌓는 방향(flex-direction)을 결정하는 속성값 두 가지: row, col..
-
HTML Page Layout : 화면을 나누는 방법각종 학습 요약/Web 2022. 4. 28. 16:50
페이지 레이아웃 레이아웃: 화면을 나누는 방법 HTML 구성 기본 TIP html을 작성할 때는 작성한 요소들이 위쪽으로부터 아래쪽으로, 그다음엔 왼쪽으로부터 오른쪽으로 쌓여간다고 생각하면 작업이 수월하다. CSS style 작업을 하기 전 가장 먼저 해야할 일 : 레이아웃 리셋 HTML 문서는 지금 막 생성한 것이라도 자체적인 style이 있다. 때문에 예상치 않게 여백이 생기거나 사이즈 계산이 맞지 않게 된다. 브라우저 간의 차이도 있고. 그래서 이런 차이들을 최소화 하는 style을 가장 먼저 적용하는데, 이 작업을 레이아웃 리셋이라고 한다. * { box-sizing: border-box; } body { margin:0; padding:0; }
-
기초 CSS의 이해각종 학습 요약/Web 2022. 4. 27. 17:06
*** 마크다운으로 작성한 내용을 기본 에디터로 수정하다보니 깨져보이는 곳이 있을 수 있습니다. 양해바랍니다. *** *** 문제되는 자료가 있을 시 댓글로 남겨주시면 수정하겠습니다. *** CSS 기초 CSS란? Cascading Style Sheets의 약자. 번역기 돌리면 '계단식 스타일 시트'라고 나오는데 솔직히 뭔 소린지 모르겠다. 근데 어쨌든 HTML의 시각적인 요소를 조작할 수 있는 웹 기술이다. 기본 구조 형식(스타일시트 사용 시) 오늘 배운 html/css로 그려보았다. ㅎㅎ 셀렉터는 여러 종류가 있다. 태그 셀렉터, id 셀렉터, class 셀렉터, 수많은 수도 셀렉터와 상태 셀렉터들... 태그, id, class만 알아도 기본이지만, 필요에 따라 다른 것들도 익혀보자. 여기서는 말고,..
-
기초 HTML의 이해각종 학습 요약/Web 2022. 4. 27. 15:35
HTML 기초 html이란? HyperText Markup Language의 약자. 즉, 하이퍼텍스트(웹문서)를 위한 구조화된(마크업) 언어. 기본 구조 형식 대개의 경우는 열고 닫는 태그(Tag), 표현하는 속성(Attribute), 담기는 내용(Content)으로 구성된다. 여는 태그부터 닫는 태그까지를 하나의 요소(Element)라고 한다. 중첩(ㅇㅁㅁㅇ)될 수 있다. 교차(ㅇㅁㅇㅁ)는 불가. 중첩된 경우, 바깥쪽의 요소는 '부모 노드(Parent node)', 내부의 노드는 자식 노드(Child node)라고 한다. 나란한 수준에 있는 노드는 '형제 노드(Sibling node)'라고 한다. 닫을 필요 없이 스스로 존재하는 태그들은 Empty Elements(또는 Se..