전체 글(37)
-
[ GitHub ] 브랜치(Branch) 이란?
깃과 깃허브를 사용할때 브런치를 빼 먹을 수 없는데 도대체 브랜치가 무엇이길래...? ✨ 브랜치에 대해 알아보도록 하자 ✨ 💖 브랜치(Branch) 1. 모든 버전 관리 시스템에는 브랜치(Branch)라는 개념이 있습니다. 브랜치는 원래 나뭇가지라는 뜻입니다. 버전 관리 시스템에서는 나무가 가지에서 새 줄기를 뻗듯이 여러 갈래로 퍼지는 데이터 흐름을 가르키는 말로 사용합니다. 2. 브랜치는 독립적으로 어떤 작업을 진행하기 위한 것입니다. 필요에 의해 만들어지는 각각의 브랜치는 다른 브랜치의 영향을 받지 않기때문에, 여러작업을 동시에 진행할 수 있습니다. 즉, 자유롭게 일할 수 있고 협업을 쉽고 편리하게 할 수 있도록 도와줍니다. 📑 브랜치 기능 💬 분기 - 새 브랜치를 만드는 것을 분기(Branch)라 ..
2023.03.12 -
[ GitHub ] 깃허브(GitHub) 란?
깃과 깃허브 둘의 관계는 무엇이며 어떤것을 지원하길래 수 많은 개발자가 이용하는 것일까? ✨깃허브에 대해서 좀 더 알아보도록하자.✨ 💖 깃허브(GitHub) 1. 깃허브는 소프트웨어 개발 프로젝트를 위한 소스코드 관리서비스(원격 저장소) 입니다. 소스코드 열람 및 간단한 버그정리, 버전관리 그리고 sns기능도 있는 호스팅 플랫폼 서비스입니다. 그래서 함께 개발한 소스코드를 공유할때 또는 상대로부터 받은 코드를 수정할때 굉장히 유용하게 쓰입니다. 2. 깃허브는 깃을 웹에서 보다 편하게 쓸 수 있도록 만든 도구입니다. 즉, 깃을 활용해서 짠 코드를 공유할 수 있는 공간이라 생각하면 됩니다. 예를 들어 깃에서는 명령어를 하나하나 입력해야 하지만, 깃허브는 웹그래픽 기반의 도구이기 때문어 서비스를 더 직관적으로..
2023.03.12 -
[Git] 깃(Git) 이란?
프로그래밍을 공부하는 사람이라면 누구나 깃이나 깃허브에 대해 한번쯤 들어봤을 것이다. 작성한 소스관리를 위해 필요한 시스템인 깃! ✨ 더 나은 개발자가 되기 위해천천히 알아보자 ✨ 💖 깃(Git) 1. 2005년, 리누스 토르발스(Linus Torvalds)는 깃(Git)을 처음 세상에 소개하면서 '깃은 지옥에서 온 관리자'라 말하였다. 그가 말한 '지옥은' 어디였을까? 26년 동안 1만 명이 넘는 소프트웨어 엔지니어들이 오픈 소스 방식으로 2천만 줄이 넘는 컴퓨터 소스코드를 작성했다면 바로 그것이 지옥이 아니었을까? 이러한 지옥에서 태어난 소프트웨어가 바로 리눅스(linux) 운영체제이다. 2. 지옥같은 작업환경에서 벗어나기 위해 만든 시스템이 바로 깃입니다. 리눅스를 만드는 개발자들은 깃을 통해 리눅..
2023.03.12 -
[ CSS3 ] 미디어 쿼리 (Media Query) + 각 디바이스
💖 CSS 미디어 쿼리(Media Query) 미디어 쿼리는 단말기의 유형, 화면 해상도, 뷰포트 너비 등에 따라 사이트의 스타일(CSS)을 적용할 수 있습니다. 해상도 320px 이상 또는 768px 미만 -> 스마트폰 해상도 768px 이상 또는 1024px 미만 -> 태블릿 해상도 1024px 초과 -> PC 1. , , , 기타 다른 HTML 요소에 media 특성을 사용해 특정 매체만 사용하도록 할 때 사용합니다. 2. CSS @media, @import @규칙을 사용해 특정 조건에 따라 스타일을 적용할 때 사용합니다. 3. 모든 최신 브라우저에서 미디어 쿼리가 동작하지만, 만약 IE 8이하에서 동작해야하는 경우라면 polyfill 라이브러리를 사용합니다. @media only | not 미디어..
2023.03.12 -
[CSS3] 텍스트 줄 바꿈 💥텍스트 자르기
구글 API를 진행하면서 텍스트 줄 바꿈과 텍스트 (...) 자르기를 진행해 보았다. 내가 알던 CSS3지식을 더해 줄 수 있는 정리를 진행하고자 글을 작성하기로 하였다. 🎁 CSS3를 이용한 텍스트 처리에 대해 알아보도록하자! 🎁 ⭐ white-space p {white-space: nowrap;} white-space 속성은 내부에서의 자동 줄 바꿈 여부를 나타내는 값을 지정합니다. 이 속성은 상속됩니다. 🪄 white-space 속성값 📌 normal : 기본값으로 글자 줄이 자동으로 바뀝니다. 콘텐츠가 요소의 너비를 초과할 경우 다음 줄로 바뀝니다. 📌 nowrap : 줄 바꿈이 실행되지 않습니다. 즉, 콘텐츠가 다음 줄로 바뀌지 않습니다. 📌 pre : 줄 바꿈과 기타 공백이 유지됩니다. 이 가..
2023.03.12 -
[HTML5] OG (Open Graph)태그
내가 만들 사이트의 썸네일과 제목을 설정하는 것을 인강에서 배웠다. 하지만 정확한 이론을 알지 못하고 따라한 것이기에 이번 기회에 더 깊게 배울 수 있도록 공부하기로 하였다. 🎁 하나하나 천천히 뜯어보고 알아보자! 🎁 💖 OG (Open Graph) 란? 해당 콘텐츠의 요약 내용이 "SNS에 게시되는데 최적화된 데이터"를 가지고 갈 수 있도록 설정하는 것 미리보기가 가능한 정보를 노출해준다 = 미리보기 화면 생성 오픈그래프 (OG, 오픈 그래프 프로토콜) 는 어떤 HTML문서의 메타정보를 쉽게 표시하기 위해서 메타정보에 해당하는 제목, 설명, 문서의 타입, 대표 URL 등 다양한 요소들에 대해서 사람들이 통일해서 쓸 수 있도록 정의해놓은 프로토콜 🔊 (오픈 그래프) 프로토콜 프로토콜(Protocol)은 ..
2023.03.12