📌 웹 표준 웹 표준이란 W3C에서 권고하는 웹에서 표준적으로 사용되는 기술이나 규칙으로, 사용자가 어떠한 운영체제나 브라우저를 사용하더라도 웹페이지가 동일하게 보이고 정상적으로 작동할 수 있도록 하는 웹 페이지 제작 기법을 가지고 있습니다. 장점 유지 보수의 용이성 웹 호환성 확보 검색 효율성 증대 웹 접근성 향상 Semantic HTML 웹 표준에서는 HTML을 시맨틱하게 작성하는 것이 중요합니다. 시맨틱(semantic)의 뜻은 의미가 있는 이라는 뜻을 가지고 있습니다. 그래서 Semantic HTML은 HTML을 구조만 만드는 것이 아니라 의미까지 가지게 한다는 것입니다. 필요한 이유 개발자 간 소통에 용이 검색 효율성 증가 웹 접근성 자주 사용되는 Semantic 요소들 요소 종류 설명 페이지나..
📌 UI UI(User Interface, 사용자 인터페이스)는 사람들이 컴퓨터와 상호 작용하는 시스템을 의미합니다. 사용자가 확인하게 되는 디자인이나 레이아웃 같은 개념을 포함합니다. 📌 UX UX란 사용자가 어떤 시스템, 서비스, 제품 등을 직, 간접적으로 이용하면서 느끼는 총체적 경험이라고 할 수 있습니다. 예를 들어, 어느 한 쇼핑 사이트를 이용한다고 해보겠습니다. 사이트에서 광고가 마구마구 뜨는지, 로딩 시간, 제품의 정보가 명확하게 표시되는지, 제공하는 로그인의 종류 등 이런 모든 경험들이 모두 UX라고 할 수 있습니다. 📌 UI와 UX의 관계 UX는 UI를 포함합니다. 그런데 좋은 UX가 좋은 UI를 의미하는 것도 아니고 좋은 UI가 좋은 UX를 보장하는 것은 아닙니다. UI가 특별하게 화려..
저번 회고에도 했던 말인 것 같은데 또 해봅니다. 벌써…한달이…? 😀 일단 지난 회고때 작성했던 KPT를 확인해보겠습니다. 🧐 저번 회고에 작성한 Try를 해보았을까? 원래 하던 공부 시간에서 최소 1시간은 늘린다. 확실히 늘었습니다. 진도 따라가기 + 복습 + 스터디 준비 만으로도 하루가 부족한 것을 느꼈기 때문에 저녁먹고 운동하고 씻는 시간을 제외하면 컴퓨터 앞에만 앉아있는 것 같습니다… 혼자였으면 못했을 것 같지만 모각코방에서 있으면 같이 하는 느낌이라 더 오래할 수 있었습니다. 감사합니다 여러분. 체계적인 계획을 세워 공부를 진행한다. 계획을 세워서 진행하긴 하지만 체계적인지까지는 잘 모르겠습니다. 좀 더 생각해서 계획을 세워봐야할 것 같습니다. 🧐 Keep - 계속 지켜나가고 있을까? 나서지 않..
오늘은 3월 13일이다. 캠프를 시작한지 벌써 한달이 지났다. Keep 나서지 않는 성격을 고치기 위해서 여러가지를 시도 (모더레이터, 스터디장) 1일 1알고리즘 풀이를 수행하여 코딩테스트 대비 하루 할 일을 정하여 전부 끝마치려고 노력 건강을 위해서 주 3회 헬스 1시간 씩 Problem 모더레이터를 하고 있지만 매끄럽게 진행을 하지 못하는 문제가 있는 것 같다. 하루 할 일의 양을 좀 적게 설정하는 것 같은 느낌이다. 절대적인 공부의 양도 좀 적은 느낌이다. Try 원래 하던 공부 시간에서 최소 1시간은 늘린다. 체계적인 계획을 세워 공부를 진행한다. 마무리 지금까지는 어느 정도 아는 내용이기도 해서 살짝 적게 한 느낌적인 느낌이 있는데, 앞으로 섹션이 지나면 지날수록 배워야할 것도 산더미고 해야할 ..
배포 링크 https://novice-hero.github.io/fe-sprint-my-agora-states/ My Agora States novice-hero.github.io 📄 소개 코드스테이츠 부트캠프에서 솔로 프로젝트로 제작한 웹 사이트입니다. 질문을 등록할 수 있고 등록된 질문들을 확인할 수 있습니다. 💡 구현 기능 디스커션 배열 및 추가 한국 시간 저장 로컬 스토리지 사용해서 디스커션 저장하고 불러오기 페이지네이션 모달 Github Page 배포 디자인 배경화면 뒤에 반짝이는 별 반짝이는 제목 질문 등록할 때 랜덤 아바타 반응형 디자인 🔎 주요 기능 시연 페이지네이션 기능 모달 & 저장 기능 반응형 디자인 💢 어려웠던 점 디자인 디자인은 항상 어렵습니다... 요즘에 픽셀 아트가 눈에 자주 ..
💡 추가 기능 비밀번호 표시 on / off let elShowPasswordBtn = document.querySelectorAll(".show-button"); elShowPasswordBtn.forEach((btn) => { btn.onclick = (e) => { const password = e.target.parentElement.childNodes[1]; // input let status = e.target.getAttribute("value"); switch (status) { case "hide": password.type = "text"; e.target.setAttribute("value", "view"); e.target.src = "./images/hide.png"; break;..
❓ JavaScript Koans란 Koans는 불교에서 유래된 단어로, 결론을 내리기 전에 이게 왜 맞는지 깊게 고민한다는 의미를 가지고 있다고 합니다. JavaScript Koans는 부트캠프에서 하게 된 자바스크립트를 전체적으로 공부하고 되돌아보며 문제를 푸는 시스템입니다. 🙁 하면서 헷갈렸던 부분 Object.assign const obj = { mastermind: "Joker", henchwoman: "Harley", relations: ["Anarky", "Duela Dent", "Lucy"], twins: { "Jared Leto": "Suicide Squad", "Joaquin Phoenix": "Joker", "Heath Ledger": "The Dark Knight", "Jack Ni..
⚙️ 기능 기본적인 사칙연산 기능 계산 버튼 누르지 않고 연산자 버튼만 눌러서 계속 계산 초기화 기능 🥲 어려웠던 점 처음엔 계산기의 가장 기본적인 기능을 구현하는 것이라고 생각해서 금방 할 수 있을 것 같다고 생각했습니다. 그런데 그 생각은 너무나도 오만한 생각이었습니다... 코드를 작성하고 호기롭게 테스트를 해보았지만 나오는 결과는 빨간 물결의 향연이었습니다. 엄청 많은 오류들과 싸웠는데 그 중 몇 가지를 소개해보겠습니다. 1. 연산자를 연속으로 다르게 눌렀을 때 처음 눌렀던 연산자로 고정이 되는 오류 if (previousKey === "operator") { operatorForAdvanced = buttonContent; return; } 이 경우도 생각을 꽤 해서 풀었는데 사실 결과는 간단하였..
