본문 바로가기

JavaScript5

코딩 컨벤션이란? (feat. 케이스 스타일) 안녕하세요 웹 YB 김시연입니다😀세미나를 열심히 듣고 복습하던 중 '컨벤션'이 뭐지? 하고 찾아보다가이후 협업 시에도 필요할테니 정리해보면 좋을 것 같아서 이번 공유 아티클 주제로 선정하게 되었습니다.(뭔지도 잘 몰라서.. 이번에 빠삭 정리해보겠습니다!!!) 프로그래밍을 하다 보면 변수, 함수, 클래스 이름을 지을 때 다양한 규칙을 따르고는 하는데이런 규칙들은 코드의 가독성을 높이고 팀 내에서 또는 개인 프로젝트에서 일관성을 유지하기 위해 중요하다고 한다.먼저 코딩 컨벤션에 대해 정리하기 전에 케이스 스타일이 뭔지부터 짚고 넘어가면 좋을 것 같다. 🔎 케이스 스타일(Case Style)이란?변수명, 함수명, 파일명 등에 사용하는 작명 규칙이다.이름예시주로 사용하는 곳카멜 케이스 (camelCase).. 2025. 5. 2.
Vanilla JS와 React (Vanilla JS는 언제 쓰는건가?) 안녕하세요! ! 36기 YB 한승우입니다 😄 React, Vue와 같은 프레임워크가 대세인 지금, 여전히 Vanilla JS로 웹 서비스를 개발하는 기업이 존재합니다. 단순히 기술이 오래되었기 때문이 아니라, 지금도 상황에 따라 Vanilla JS가 더 합리적인 선택이 되는 경우가 있기 때문입니다.이 글에서는 Vanilla JS와 React의 구조적 차이부터 실제 적용 맥락까지 짚어보며, 왜 어떤 팀은 여전히 React 대신 순수 JavaScript를 선택하는가에 대한 이야기를 다뤄보려 합니다!! 🔥🔥 1. Vanilla JS는 뭘까? a. 정의와 개념Vanilla JS는 아무런 프레임워크나 라이브러리를 사용하지 않고 브라우저가 기본적으로 제공하는 API만을 사용하는 순수한 JavaScri.. 2025. 4. 25.
JavaScript 프론트엔드 면접 개념 정리 & 자주 나오는 질문 모음집 JavaScript 핵심 개념 & 면접 질문 정리 안녕하세요, 36기 YB 웹파트 최서희입니다. 😀 2주차 세미나를 통해 JavaScript를 더욱 구체적으로 배울 수 있었고, 이를 바탕으로 기술 면접 준비에 도움이 되는 내용을 정리해보았습니다. 이번 포스팅에서는 프론트엔드 면접을 준비하며 정리한 JavaScript 핵심 개념과 자주 등장하는 면접 질문들을 공유합니다. 스크랩해두고 꼭 복습해보세요! 🔥 ✔️ 개념 정리 (핵심 요약) 📌 1. 변수 선언: var, let, const var: 함수 스코프, 호이스팅, 재선언 가능 let: 블록 스코프, TDZ 존재 const: 블록 스코프, 상수 선언 📌 2. 호이스팅 (Hoisti.. 2025. 4. 15.
JS에서 Truthy와 Falsy 그리고 단락평가 안녕하세요! AT SOPT YB 36기 장정훈입니다.저는 오늘 Js의 Truthy와 Falsy 그리고 단락평가에 대해 말해보고자 합니다.자바스크립트의 if (value) 같은 조건문에서 value의 값이 숫자나 문자열이 들어가도 잘 작동합니다.🤔🤔🤔왜 그럴까요? 이는 자바스크립트가 내부적으로 값을 논리형(Boolean)으로 바꿔 판단하기 때문입니다.그리고 이때 기준이 되는게 바로 Truthy와 Falsy입니다. Truthy? Falsy?Falsy?Falsy한 값이란 불리언 자료형의 거짓(false)은 아니지만 거짓과 같은 의미로 쓰이며, 조건식에서 거짓(false)으로 평가합니다.let f1 = undefined;let f2 = null;let f3 = 0;let f4 = -0;let f5 = Na.. 2025. 4. 11.
🔍앵커 기반 스크롤의 주소 문제 해결하기 안녕하세요 웹 YB 임지수입니다!이번 1주차 과제를 하면서 생긴 의문을 해결하고 싶어 찾아보다가 관련 내용을 정리해 보았습니다.   위 영상에서 각 메뉴를 클릭할 때마다 #all, #soong, #food 가 주소 뒤에 붙는 거 보이시나요?깔끔한 URL을 유지하고 싶었는데 은근히 거슬리더라구요ㅎㅎ😅  저는 스크롤 이동을 위해 HTML의 href="#id" 형식을 사용했는데 이 방식 때문에 메뉴 클릭 시 해당 id가 URL 뒤에 그대로 드러나는 현상이 생겼습니다.. 그래서 혹시 JavaScript 없이 HTML/CSS만으로 이 문제를 해결할 수는 없을까? 싶었지만... 결론부터 말씀드리자면 HTML/CSS만으로 주소창에서 #id 값을 숨기는 방법은 찾지 못했습니다🤯결국 이 문제를 해결하기 위해서는 Ja.. 2025. 4. 9.