목록분류 전체보기 (112)
생각기록
로컬 저장소 & 원격 저장소 개념 저장소는 파일, 디렉토리를 포함하는 공간 "로컬 저장소"는 내 컴퓨터 Github같은 서버의 "원격 저장소" 보통 로컬 저장소에서 작업 수행 후 원격 저장소에 저장 더보기 *디렉토리랑 폴더랑 비슷한데, 차이는 뭘까? https://byul91oh.tistory.com/238 커밋과 푸쉬 개념 커밋 (commit) : 파일 추가, 변경 내용 컴퓨터 지정 폴더 (로컬 레포지토리(.git) 저장) / 세이브 포인트 저장 푸쉬 (push) : 커밋을 원격 저장소 (리모트 레포지토리)에 업로드 브랜치 개념 GitHub 사용법 github에 저장소 작성 (git init) 또는 복제(git clone) 파일의 작성, 편집 파일의 생성, 변경, 삭제를 git 인덱스에 추가 (git ..
https://www.advancedwebranking.com/html 에서 통계적으로 32가지의 태그를 보통 사용한다고 한다. 어떤걸 제일 먼저 공부해야할지 알 수 있다. 이미지 태그, a태그(하이퍼링크), 상대경로와 절대경로 이미지 태그 src : 이미지의 경로 title : 이미지위에 마우스 올렸을 때 보이는 것 alt : 이미지가 안보일 때 출력할 내용(권장 속성) 크기 지정 가로, 세로를 지정하지 않으면 사진 원본크기로 출력 width : 가로 크기 지정 height : 세로 크기 지정 src 위치 경로 설정할때 주의사항 같은 폴더 일 때 내가 만든 웹문서와 같은 위치 에 있게 해야 한다. 그렇다면, 만약 다..
영어로 구분하자면, 명사(HTML) 형용사(CSS) 동사(JS) 귀여운(css) 고양이(html)가 춤추고 있다(js) 웹문서 : 우리가 화면에서 보고있는 인터넷 화면, 즉, 홈페이지를 구성하는 문서 웹브라우저 : 웹문서는 웹브라우저 프로그램을 통해서 볼 수 있다. 예)인터넷 익스플로어, 크롬 확장자 : 웹문서의 확장자는 html이다. 예) 그림 파일의 확장자는 jpg, png등이 있다. HTML(Hypertext Markup Language) : 웹 페이지를 구성하는 가장 기초적인 언어 Hypertext : 웹 상의 다른 문서나 멀티미디어 등으로 이동할 수 있도록 구조화되어 있는 텍스트. 즉 링크를 의미 Markup :문서나 데이터의 구조를 명기하다. 구조 파악 좋음 예) 과정명: 풀스택 교육시간: 6..
www란? world wide web 웹은 거미줄로, 세계를 뒤덮는 거미줄이라는 의미 www 동작 원리 우리는 html로 웹 페이지 작성해서 웹 서버에 놓는다. 인터넷에 연결된 수많은 클라이언트 컴퓨터는 웹 서버에서 html 문서를 받아서 웹 브라우저를 통하여 화면에 웹 페이지를 표시한다. 웹 서버가 하는 일 웹 서버는 단순히 인터넷에 연결되어 있으면서 클라이언트 컴퓨터로부터 요청을 기다린다. 웹 서버가 요청을 받으면, 이들 자원을 찾아서 클라이언트 컴퓨터로 보낸다. 웹 서버와 클라이언트는 서로 표준 언어를 통하여 통신하는데 HTTP라는 프로토콜을 사용한다. 1. HTTP Reques (특정 파일 요구) 컴퓨터가 웹서버에 요구 2. HTTP Respnese (찾은 파일을 돌려주는) 웹서버의 응답 HTML..
에디터 : 개발을 편하게 하는 프로그램 Visual Studio Code라는 에디터에서 확장 플러그인 설치 auto commit message - 협업할 때, 시간표기(누가했는지 알 수 있음) gitlens-git supercharged - 해당 라인 커밋한 시점 등의 정보 wakatime – 개발시간 측정 (깃의 저장소 별로 개발기간, 어떤 언어를 썻는지 측정) Live server - 바로 변경사항을 라이브로 볼 수 있다. 와카타임 홈페이지에 깃허브 로그인을 하고 홈페이지 우측 상단 초록 아이콘을 우클릭, 셋팅 클릭 API KEY 복사 하고 VS코드에서 적용한다. 좌측하단에 글씨가 있거나, 없거나 하면 적용이 된 것 GIT 설치, GIT BASH 실행 맥의 터미널같은 친구, 분산 버전관리 2005년에..
2022-10-25 컴퓨터 언어는 소통하려 하는 환경과 목적에 종속적이다. 언어는 왜 하나가 아닐까? 앱과 웹 각자를 위한 언어(목표)와 디바이스(환경)가 다르다. 앱 같은 경우 핸드폰에 제스처(손가락 감지) 기능이 필요하지만, 웹에는 필요 없다. 종속적(dependent), 독립적(independent) 한 언어라는 것은 환경에 종속적, 영향을 받기 때문에 언어가 여럿이다. a, b 가 같은 기능을 같이 쓰거나 할 때 dependent(종속적)이라고 한다. a의 기능을 빼면 b도 영향을 받기 때문에 불편한 점이 생긴다. 즉, 독립적(independent)인 것이 모든 상황에서 좋다. (하지만 현실은 그렇지 않다.) hmtl : 웹 언어는 제일 성공한 언어다. 예) 피그마(figma) 웹 기반 포토샾 기..
앞에서 간단하게 인라인, 블록 요소, 선택자를 배운적이 있다. CSS의 우선순위 CSS는 기본적으로 위아래로 순차적으로 읽지만, • 동일한 요소를 다른 선택자로 적용해 여러 스타일이 적용되는 난감한 상황 이 발생하기도 함. • CSS 파일이 여러 개라면 더욱 난감해짐 *외우긴 힘듬, 자주봐라 * !important > 인라인 스타일 > 아이디 선택자 > 클래스/속성/가상 선택자 >태그 선택자 > 전체선택자 레이아웃을 위한 첫번쨰 Position과 transform에 대해서 알아보자. Position 웹 문서 안 요소들을 배치할 때, 텍스트나 이미지 원하는 곳에 배치할 때 사용 1) static : 정적 위치 지정 방식 기본 위치에 존재하는 속성값 (div같은 경우 왼쪽 상단부터), 위치 지정불가(top,..
HTML이 명사, CSS가 형용사, JS가 동사 CSS 웹문서에 쓰일 글자의 크기, 특정 태그의 색 등 서식과 관련된 내용들을 관리 CSS가 없다면? CSS 참조 방식 외부 스타일 시트 ( External Style Sheet ) css 확장자를 가진 스타일 시트 파일 생성 html 문서에 연결해 사용 예)공통 적용 할 때, 3개의 파일에 똑같은 빨강을 입힐 때 내부 스타일 시트 ( Internal Style Sheet ) 공유할 필요 없고, 이파일에만 저장할 때 HTML 문서 내에서 태그 내부에 html 오렌지 사과 파인애플 수박 왕수박 덜익은수박 씨없는수박 .ss p:nth-child(1) {background-color: rgba(255, 180, 130, 0.272);} .ss p:nth-of-t..