안녕하세요~ 오늘은 자바스크립트에서 같은 동작을 여러 번 실행하기 위해 사용하는 반복문을 알아보겠습니다! 코딩하다가 겪게되는 노가다의 힘듦....ㅜㅜ 반복문을 알기 전까지엔 정말 힘들게 코딩했던 것 같아요. 하지만 오늘 배운 반복문들을 통해 더욱 깔끔하고 간결하게 작업을 할 수 있었습니다! 일단 반복문에는 for()문, forEach문, for in문, for of문 등 원래 몇 개 더 있지만 이 4개를 위주로 살펴보겠습니다. 📛for 문 자바스크립트에서 가장 많이 사용된다고 할 수 있습니다! for문은 조건에 들어가는 값이 일정하게 커지면서 명령을 반복 실행할 때 편리하기도 해요! for 문에서는 몇 번 반복했는지 기록하기 위해 카운터를 사용하고 for 문의 첫 번째 항에서 카운터 변수를 지정합니다. ..

안녕하세요~ 오늘은 웹문서의 본문을 구성하는 요소들 중 section 관련한 요소를 알아보려 합니다! 일단 section 태그가 무엇인지 먼저 알고 넘어가는게 좋겠죠? 🔖 정의 및 특징 태그는 주제별 그룹의 콘텐츠 섹션을 정의합니다. 태그는 HTML 문서에 포함된 독립적인 섹션(section)을 정의할 때 사용합니다. 태그는 보통 제목 요소(h1~h6)를 자식 요소로 포함하고 있는 경우가 많습니다. 태그는 블록 요소로서, 문장이나 문서의 스타일링 요소가 아닙니다. 그러므로 스크립트의 편의나 영역을 위함이라면 태그가 적합합니다. 네, 그러면 섹션 관련 요소에 관한 요소를 표로 정리해보겠습니다. 🔖섹션 관련 요소 태그명 태그의 의미 및 특징 사이트 본문에 해당하는 모든 콘텐츠를 포함하는 섹션을 설정 사이트의..

안녕하세요~!! 오늘은 자바스크립트의 연산자에 대해 알아보겠습니다. 연산자는 자바스크립트에서 기본이라고 할 수 있습니다! 💨연산자란? 프로그램에 필요한 수식을 만들 때 필요한 것으로, 연산자의 종류에는 산술 연산자, 대입 연산자, 비교 연산자, 논리 연산자, 비트 연산자, 삼항 연산자 등이 있습니다. 하지만 비트 연산자와 삼항 연산자는 거의 죽은 문법으로 오늘은 4개만 다뤄볼거에요! 1️⃣산술 연산자 산술 연산자는 사칙연산을 다루는 가장 기본적이면서도 많이 사용하는 연산자입니다. 산술 연산자는 모두 두 개의 피연산자를 가지는 이항 연산자이며, 피연산자들의 결합 방향은 왼쪽에서 오른쪽입니다. 산술 연산자의 종류를 표로 한 번 살펴보겠습니다. 2️⃣대입 연산자 대입 연산자는 변수에 값을 대입할 때 사용하는 ..

안녕하세요~! 오늘은 CSS에서 자주 쓰이는 선택자 중 id선택자와 class선택자에 대해 알아보겠습니다. 일단 선택자가 무엇인지 알아볼까요? ✅선택자 선택자란 CSS로 UI의 어느 부분을 디자인할지, 즉 표현할 대상이 되는 부분을 말합니다. CSS로 속성을 부여하는 형식은 밑의 이미지를 참고해주세요. 요소를 선택하는 방법, 즉 선택자의 종류는 type 선택자, id 선택자, class 선택자 등 여러 가지가 있습니다. 그 중에서도 id 선택자와 class 선택자가 무엇인지, 둘의 차이점은 무엇인지 알아보겠습니다. ✅id 선택자 HTML 문서의 요소 중 같은 요소라도 각기 다른 이름을 지정하여 따로 속성을 부여할 수 있습니다. HTML 요소에 id로 이름을 붙일 때에는 유일한 이름을 부여해야 하며, 다른..

See the Pen Tail Animation by YeoDaSeul4355 (@YeoDaSeul4355) on CodePen. 안녕하세요~! 오늘은 CSS를 이용해 간단한 애니메이션 효과를 만들어봤습니다! 자세한 건 코드펜을 참조해주세요 (^///^)

안녕하세요, 오늘은 CSS의 표현 방법들을 알아보겠습니다~! 총 4가지가 있더군요~ 일단 CSS를 정의하는 방법을 알아야하는데요~ 내부 스타일시트, 외부 스타일시트, 인라인 스타일시트 등이 있습니다. 실제로는 외부 스타일시트를 많이 사용하는 편이지만, 간단한 건 내부 스타일 시트로만으로 사용할 수 있습니다. 또한, 인라인 스타일시트는 대체로 사용하진 않지만, 가장 우선순위가 높아 꼭 필요할 경우엔 편리하게 사용 가능합니다. 참고로 CSS에서의 주석은 /* */로 표현한다는 것! 이제 차근차근 하나씩 살펴볼게요~ 💥내부 스타일시트 CSS를 HTML 문서 안에 태그로 기재하여 HTML 문서 안에 CSS가 함께 저장되도록 하는 형태입니다. 예제1) Web2023_기초부터 쌓는 CSS 💥외부 스타일시트 스타일 ..

안녕하세요, 오늘은 자료형에 대해 알아보겠습니다~! 일단 자료형이 무엇인가 싶으실 거에요! ✔️자료형 자료형이란 저장되는 데이터의 종류에 따른 형태로, 저장되는 값의 종류와 범위에 따라 다르게 표현됩니다. 쉽게 프로그램에서 처리할 자료의 형태라고 생각해주시면 될 것 같아요. 그래서 자바스크립트의 자료형은 크게 '원시 유형(primitive type)'과 '객체(object)'로 나뉘어집니다. 원시 유형은 하나의 값만 저장하는 자료형으로, 숫자형과 문자열, 논리형, undefined, null, symbol 유형이 있습니다. 이 외에는 모두 객체입니다. 그럼 원시 유형의 자료형들을 살펴볼까요? 💦숫자형 숫자형은 모든 프로그램의 가장 기본이 되는 자료형입니다. 자바스크립트에서는 큰따옴표 없이 입력하면 숫자로..

안녕하세요! 오늘은 텍스트 관련 요소에 대해 살펴보겠습니다. 텍스트 관련 요소들은 말 그대로 글자에 태그를 주어 요소를 넣어주는 것입니다. 텍스트 관련 요소들 중 어떤 것이 있는지 한 번 표로 확인해보겠습니다! 💬텍스트 관련 요소 태그명 태그의 의미 및 특징 강조하고 싶은 텍스트를 정의하기 위한 태그이며 기울임체로 표시됩니다. 중요한 텍스트를 정의하기 위한 태그이며 굵은체로 표시됩니다. 주의 깊게 볼 텍스트 부분을 강조하기 위한 태그이며 노란색으로 표시됩니다. 의미를 가지고 있지 않으며 단순히 텍스트를 굵은체로 표시합니다. 주의 사항, 법적 제한, 저작권 등의 정의하기 위한 태그이며 작은 글씨로 표시됩니다. 아래첨자 텍스트를 정의하기 위한 태그입니다. 위첨자 텍스트를 정의하기 위한 태그입니다. 테이블로만..