코드스테이츠 프론트엔드

코드스테이츠 프론트엔드

Section 2 회고

저번 회고에도 했던 말인 것 같은데 또 해봅니다. 벌써…한달이…? 😀 일단 지난 회고때 작성했던 KPT를 확인해보겠습니다. 🧐 저번 회고에 작성한 Try를 해보았을까? 원래 하던 공부 시간에서 최소 1시간은 늘린다. 확실히 늘었습니다. 진도 따라가기 + 복습 + 스터디 준비 만으로도 하루가 부족한 것을 느꼈기 때문에 저녁먹고 운동하고 씻는 시간을 제외하면 컴퓨터 앞에만 앉아있는 것 같습니다… 혼자였으면 못했을 것 같지만 모각코방에서 있으면 같이 하는 느낌이라 더 오래할 수 있었습니다. 감사합니다 여러분. 체계적인 계획을 세워 공부를 진행한다. 계획을 세워서 진행하긴 하지만 체계적인지까지는 잘 모르겠습니다. 좀 더 생각해서 계획을 세워봐야할 것 같습니다. 🧐 Keep - 계속 지켜나가고 있을까? 나서지 않..

코드스테이츠 프론트엔드

[SEB_FE] Section 1 회고

오늘은 3월 13일이다. 캠프를 시작한지 벌써 한달이 지났다. Keep 나서지 않는 성격을 고치기 위해서 여러가지를 시도 (모더레이터, 스터디장) 1일 1알고리즘 풀이를 수행하여 코딩테스트 대비 하루 할 일을 정하여 전부 끝마치려고 노력 건강을 위해서 주 3회 헬스 1시간 씩 Problem 모더레이터를 하고 있지만 매끄럽게 진행을 하지 못하는 문제가 있는 것 같다. 하루 할 일의 양을 좀 적게 설정하는 것 같은 느낌이다. 절대적인 공부의 양도 좀 적은 느낌이다. Try 원래 하던 공부 시간에서 최소 1시간은 늘린다. 체계적인 계획을 세워 공부를 진행한다. 마무리 지금까지는 어느 정도 아는 내용이기도 해서 살짝 적게 한 느낌적인 느낌이 있는데, 앞으로 섹션이 지나면 지날수록 배워야할 것도 산더미고 해야할 ..

코드스테이츠 프론트엔드

[SEB_FE] 나만의 아고라 스테이츠 만들기

배포 링크 https://novice-hero.github.io/fe-sprint-my-agora-states/ My Agora States novice-hero.github.io 📄 소개 코드스테이츠 부트캠프에서 솔로 프로젝트로 제작한 웹 사이트입니다. 질문을 등록할 수 있고 등록된 질문들을 확인할 수 있습니다. 💡 구현 기능 디스커션 배열 및 추가 한국 시간 저장 로컬 스토리지 사용해서 디스커션 저장하고 불러오기 페이지네이션 모달 Github Page 배포 디자인 배경화면 뒤에 반짝이는 별 반짝이는 제목 질문 등록할 때 랜덤 아바타 반응형 디자인 🔎 주요 기능 시연 페이지네이션 기능 모달 & 저장 기능 반응형 디자인 💢 어려웠던 점 디자인 디자인은 항상 어렵습니다... 요즘에 픽셀 아트가 눈에 자주 ..

코드스테이츠 프론트엔드

[SEB_FE] 유효성 검사 예제

💡 추가 기능 비밀번호 표시 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;..

코드스테이츠 프론트엔드

[SEB_FE] JavaScript Koans

❓ 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..

코드스테이츠 프론트엔드

[SEB_FE] 작동하는 계산기 만들기

⚙️ 기능 기본적인 사칙연산 기능 계산 버튼 누르지 않고 연산자 버튼만 눌러서 계속 계산 초기화 기능 🥲 어려웠던 점 처음엔 계산기의 가장 기본적인 기능을 구현하는 것이라고 생각해서 금방 할 수 있을 것 같다고 생각했습니다. 그런데 그 생각은 너무나도 오만한 생각이었습니다... 코드를 작성하고 호기롭게 테스트를 해보았지만 나오는 결과는 빨간 물결의 향연이었습니다. 엄청 많은 오류들과 싸웠는데 그 중 몇 가지를 소개해보겠습니다. 1. 연산자를 연속으로 다르게 눌렀을 때 처음 눌렀던 연산자로 고정이 되는 오류 if (previousKey === "operator") { operatorForAdvanced = buttonContent; return; } 이 경우도 생각을 꽤 해서 풀었는데 사실 결과는 간단하였..

코드스테이츠 프론트엔드

[SEB_FE] 계산기 목업 만들기

❓ 고려한 점 먼저 계산기를 크게 3가지 영역으로 나누었습니다. 닫기, 최소화, 최대화 버튼 영역 계산되는 숫자가 보일 영역 숫자와 기호 버튼들 영역 이 3가지 영역을 display: flex를 사용하고 direction을 column으로 변경해 세로 축으로 정렬되게 했습니다. 그리고 flex: grow로 일정 비율로 나누어지게 설정했습니다. 숫자와 계산 기호 영역도 flex: grow를 사용하여 일정 비율로 나누어지게 설정했습니다. 또한 hover와 active를 활용하여 hover일 경우 색이 변하고, 누르면 누른 효과가 나오게 설정했습니다. 기본 box-shadow: 2px 2px 6px #3c3c3dc0; :active box-shadow: 1px 1px 2px #4d515988; position..

코드스테이츠 프론트엔드

[SEB_FE] OT

23.02.13 오늘은 드디어 프론트엔드 부트캠프의 시작이었다. 합격 소식을 듣고부터 기대감 70 두려움 30인 상태로 기다려왔는데 막상 시작해보니 체계적인 시스템과 친절한 크루분들 덕분에 두려움은 많이 줄어들었다 😃 역시 첫날이니만큼 오늘의 일정은 OT였다. 캠프를 진행하면서 사용할 여러 학습 툴들의 설정과 사용 방법과 메타인지, 페어 프로그래밍 등의 학습 방법들, 코드스테이츠가 제공하는 여러 혜택들의 설명을 들으며 시간을 보냈다. 라이브 세션 중 숙제 하나를 내주셨는데, 이미 노션에도 작성했지만, 블로그에도 한번 더 작성해서 나의 마음에 새겨야 겠다. 나의 목표 2023년이 끝나기 전에 취업하기 지속적으로 성장하는 개발자 되기 같이 일하면 든든한 개발자 되기 목표를 이루기 위해 부트캠프에서 꼭 얻고 ..

애송이개발자
'코드스테이츠 프론트엔드' 태그의 글 목록