나 이정민
JS 에대하여'.,_,.' 프로젝트 끄으으윽ㅌ..!! 본문
첫 프로젝트: 팀 페이지 제작 후기
저의 첫 프로젝트는 HTML과 CSS를 활용한 팀 페이지 제작이었습니다. 익숙지 않은 영역이라 어려움이 많았지만, 팀원들과의 협업을 통해 많은 것을 배웠습니다. 특히, **“소통”**이 얼마나 중요한지 체감한 프로젝트였습니다.
- 배운 점
- DOM과 document의 차이: DOM의 구조와 document 객체의 역할을 프로젝트를 통해 명확히 이해할 수 있었습니다.
- 협업과 코드 리뷰: 팀원들과 코드 리뷰를 통해 더 나은 해결 방법을 찾는 과정을 경험했습니다.
- 도전정신: 새벽까지 이어진 피드백 세션 덕분에 HTML/CSS 기초를 확실히 다질 수 있었습니다.
- 결과
소통과 팀워크 덕분에 프로젝트는 성공적으로 완성되었습니다. 앞으로도 끊임없이 학습하고, 팀워크를 통해 성장할 자신감을 얻었습니다.
(감사합니다, 7조 여러분!)
부트캠프 경험과 목표
부트캠프에서 만난 분들은 정말 뛰어난 실력을 가지고 계셨습니다. 저는 이런 훌륭한 분들과 함께 배우며, 포기하지 않고 끝까지 해내는 태도를 길러나가고 있습니다.
다가오는 발표와 이후 평가를 통해 한 단계 더 성장한 모습을 보여드리고 싶습니다.
담주 월욜에 프로젝트 팀별로 발표 후 // 베이직 스탠다드 첼린저 // 로 나뉜다고 한다.
난 베이~직
element란!!
- HTML 문서에서 개별적인 태그를 나타내는 객체입니다. <div>, <p>, <a>와 같은 특정 DOM 요소를 가리킵니다.
. document란!!
- 전체 HTML 문서의 루트(root) 객체입니다.
- HTML 문서의 모든 요소(태그), 속성, 텍스트 등을 포함합니다.
- document는 DOM 트리의 최상위 객체입니다.
- HTML 문서의 메타데이터(예: <head>, <title> 등)와 콘텐츠(예: <body> 내부 요소)를 모두 관리합니다.
JavaScript에서 객체(Object)란?
1.JavaScript에서 객체는 **키-값 쌍(key-value pair)**으로 데이터를 저장하는 데이터 구조입니다.
객체는 중괄호 { }로 정의되며, 속성과 값을 가집니다.
2.JavaScript에서는 doc이라는 단어를 특별히 정의한 것은 아니지만, document 객체를 나타내는 변수명으로 사용될 수 있습니다.
-//id가 submit_btn 인 버튼에 클릭 이벤트리스너 생성-//
document.querySelector("#submit_btn").addEventListener("click", ( ) => {
console.log("a");
doc = { }; //정보 값 초기화
let user = document.querySelectorAll(".textInput"); // textInput 클래스를 가진 것들을 전부다 user안에 넣어주기
- 파싱이란?: 텍스트 데이터를 읽고 구조화된 형태로 변환하는 과정.
- HTML 파싱의 결과: DOM 트리 생성.
- 브라우저의 역할: HTML을 파싱하여 DOM을 만들고, CSS와 JavaScript를 통해 문서를 렌더링.