션냥의 개발일지

목록 태그 알아보기 ✨이번엔 간단히 목록을 나타내주는 태그에 대해 알아볼게요.크게 순서가 없는 목록과 순서가 있는 목록으로 나눌 수 있어요.📝순서가 없는 목록 (ul)먼저 순서가 없는 목록을 만들어주는 태그인데요.ul 태그로 크게 묶어주고 그 안에 목록 구성 요소를 만들 때에는 li 태그를 이용해요.li 태그에서는 기본값으로 작은 원 불릿을 표출해요.나중에 CSS를 배운 뒤에는 불릿의 모양을 바꿀 수도 있어요.이따 뭐먹징 곱창 아구찜 마라샹궈 삼겹살|💡Tip : ul>li*4를 입력한 뒤 Tab 키를 눌러보시면 자동완성!위 코드의 출력 화면이에요. h3 태그를 이용해서 제목을 붙여줬고요,순서없는 목록을 만드는 태그인 ul 태그 안에 구성 요소 4개를 li 태그를 이용하여 넣어주었..

안녕하세요! 이번에는 본격적으로 HTML의 기본 문법에 대해 알아볼게요! 🌟📌 div 태그먼저 가장 기본적으로 웹페이지의 영역을 나누는 div 태그가 있습니다.div 태그는 화면상으로는 아무런 기능이 나타나지 않는 태그에요.하지만 화면의 구역을 나누기 위해서 지정해놓는 태그이기에 웹페이지를 구현하는데 필수적이죠.이해하기 쉽게 예시를 들어볼게요.영역1영역2💡 Tip:VSCode에서는 태그를 일일이 입력하지 않고 태그 안 내용만 입력한 뒤, Tab 키를 누르면 자동완성 되는 기능을 제공합니다. 또한 다른 태그를 함께 자동완성할 때는 +를, 같은 태그는 *n (입력할 태그 개수)를 이용하면 됩니다.위 코드는 div*2 혹은 div+div를 입력한 뒤 Tab 키를 눌러 자동완성할 수 있습니다.위 코드는 다..

안녕하세요, 개발자 여러분! ✨오늘부터 프론트엔드의 시작인 html에 대해 작성하려고 합니다. 🎉html에 대해 알기 전에, 프론트엔드에 대한 전체적인 틀을 잡고나서 공부를 시작하시면 훨씬 좋다고 생각해요그래서 먼저, 프론트 엔드의 전반적인 내용에 대해 설명하며 시작해 보려고 합니다!웹 개발이 프론트엔드와 백엔드로 나뉘어져 있다는 건 전에 말씀드렸죠?간단히, 프론트엔드는 사용자의 눈에 보이는 것, 그리고 백엔드는 그 뒤에서 데이터들이 돌아가는 것이였죠그 중 프론트엔드는 아래와 같이 나뉘어져요. 🕸️프론트엔드의 구성요소 📚프론트엔드는 크게 HTML, CSS, JavaScript로 나눌 수 있습니다.HTML: 웹사이트의 기본 뼈대를 구성합니다.CSS: 디자인 요소를 추가합니다.JavaScript: 동적..

웹 개발의 첫걸음: 프론트엔드와 백엔드 이해하기 😊안녕하세요! 기록용으로 항상 배운것들을 정리하고 있었지만,이렇게 공개적인 곳에 기록을 남기는 것이 더 의미있을 것 같아서오늘부터 함께 웹 개발의 기초부터 기록해나가려 합니다!웹 개발이란, 우리가 일상에서 자주 접하는 웹 페이지를 만드는 과정이에요.이번 포스트에서는 웹 개발의 기본 구조와 개념에 대해 설명해드릴게요.웹 페이지의 구조 🌐웹 페이지는 크게 두 부분으로 나뉩니다: 프론트엔드와 백엔드.프론트엔드 🖥️프론트엔드는 사용자가 직접 볼 수 있는 웹 페이지의 부분입니다.우리가 볼 수 있는 웹 페이지의 모든 부분이 여기에 속하죠개념적으로는 디자인, 레이아웃, 사용자 인터페이스 등이 여기에 속해요.사용자 경험(UX)을 향상시키는 모든 요소가 포함됩니다.백..