본문 바로가기

전체 글

 (64)
[git & github 기초] 2. git 기초 이해 용어정리 working directroy : 현재 작업 중인 파일과 폴더들이 모여있는 공간 repository : 모든 트랙(추적)파일과 폴더가 모여있는 공간 - commit : 단일 코드 스냅샷을 의미 - branch : 커밋이 저장된 공간 ex) 작업 디렉터리에서 작업 후 이미지 저장할 때 커밋 이름을 "이미지 추가"등으로 주석 저장하면 다른 사람이 이해편함 즉, 어떤 작업을 변경할 때 마다 커밋으로 "버튼 고침", "이미지 추가"와 같이 저장하는것 하지만 repository에 저장되는 것은 아님 ( where? master branch or main branch ) 또한, feature branch를 생성하여 스냅샷을 저장한 뒤 master branch에 옮길 수 있다.
[git & github 기초] 1. git 설치방법 보호되어 있는 글입니다.
호스팅 & 배포 개념, 실습, favicon, 경로 용어를 정리하기 앞서 프론트엔드가 진행되는 과정을 알아야한다. step 1. 사용자가 주소창에 주소를 입력한다. step 2. 브라우저가 해당 주소에 연결된 정보를 통해 서버에 요청을 날린다. step 3. 서버는 브라우저의 요청에 응답한다. ( 배포된 html, css 코드를 전달 - 호스팅 ) step 4. 브라우저가 서버로부터 전달받은 코드를 실행한다. step 5. 웹페이지에 표시된다. 1. Deploying ( 배포 ) 란? html, css, javascript로 작성된 code를 서버에 옮기는 행위를 뜻한다. 2. hosting ? 서버에 저장된 코드를 사용자(브라우저)에게 제공하는 것을 의미 3. 실습생략 # nettify 보고 배포하고 도메인 만들기 가능 # 기본적으로 nettify에서 ..
[html, css 응용] 8. 여러가지 html요소 여러가지 html 요소 : emphasize의 약자로 강조하고 싶은 텍스트를 삽입하면 텍스트 음성을 읽을 때 강조 + 텍스트로 bold처리가 자동으로 된다. 강조처리를 하고싶을 때 으로 bold 주는 것 보다 더 권장된다. : 과 비슷하지만 억양이 약간 다르다. : 문장 구분을 용이하게함 예시코드) 다음과 같은 코드를 보자. HTML & CSS Basics Summary HTML Summary HTML(HyperText Markup Language) is used to define our page content, structure and meaning. You don't use it for styling purposes. Use CSS for that instead! HTML uses"elements"t..
[영어회화 기초] 원어민이 맨날 쓰는 영어 문장 30개 보호되어 있는 글입니다.
[html, css 응용] 7. box-shadow 오늘 강의에서는 box-shadow 속성에 대해 알아보자! box-shadow는 말 그대로 박스그림자라는 의미이다. css 박스에 그림자를 값으로 설정하므로써 입체감과 웹사이트의 퀄리티를 높일 수 있다. 소스코드 li{ background-color: rgb(223, 136, 124); border-radius: 4px; margin: 32px; padding: 16px; box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.5); } # 위에 코드를 설명하자면 그림자에 대해 크기를 오른쪽으로 1px 아래쪽으로 1px 흐림정도를 4px 로 설정하고 rgba를 통해 그림자의 색상과 투명도를 설정한다. # rgba 는 rgb + 투명도이다. 실행결과 before after 입체감 뿜뿜.
[html, css 응용] 6. 마진 상쇄 이번 강의에서는 마진 상쇄에 대해 알아보자! 개발자도구를 보면 il에 margin을 30px로 설정했는데 요소들끼리 서로 마진이 겹쳐 60px가 아닌 30px로 나타나고 있다. 이를 마진상쇄라고 하며 마진상쇄가 일어나는 조건을 아래에 정리해 보겠다. 마진 상쇄 특징 1. block element와 block element 사이에서만 발생된다. 2. 인접 요소의 수직 마진에 대해서만 발생된다. 3. 수평, inline to block, inline to inline에서는 발생하지 않는다. 4. 인접한 두 요소의 마진이 서로 다를 때 마진 상쇄가 발생된다면 항상 큰 쪽이 우세하다. 5. display에서 inline-block은 마진 상쇄가 일어나지 않는다. 예시 1~5 모두 속성을 바꾸며 실습해보니 확인할..
[html, css 응용] 5. css - block, inline 이번 강의에서는 block element, inline element를 배워보자. html 요소중에는 크게 block 요소와 inline 요소가 있다. block 요소에는 p, h1 등이 있고 inline 요소에는 img, a 등이 있다. block요소는 특징은 full line, new line 이고 inline요소는 둘 다 해당되지 않는다. full line 이란 하나의 요소가 한 줄을 모두 사용하는 것을 뜻하고 new line은 여러 block요소들이 있으면 그만큼의 new line을 요구하는 것을 뜻한다. 예시) p가 차지하는 영역 vs a가 차지하는 영역 ( 파란 박스 ) inline의 주요 특징 1. top, bottom에 margin 속성이 적용되지 않는다. 2. padding을 적용하였을 ..

티스토리툴바