728x90 전체 글89 코드잇 프론트엔드 단기심화 2주차 회고 벌써 2주차가 지났다. 그러는 와중에 5월이 시작된 걸 보니 올해는 정말 순식간에 지나갈 것 같다.시간이 지나가는 만큼 나도 성장을 해야할텐대~!~! 이번주에는캡틴판교님의 프론트엔드 공부법에 대한 특강도 들을 수 있는 기회가 있었다.사실...나는 대부분의 사람들이 공부법은 알고 있을 것이라 생각한다 다!만! 실천하기 힘들뿐ㅎㅎㅎㅎㅎ그래서 질의응답시간이 더 좋았다. 가장 인상적이였던 질문과 대답은 react를 잘 알지 못해도 HTML, CSS, JS를 잘 하면 취업이 가능하다는 것이 말은 결국 기본 토대가 가장 중요하다는 뜻이라고 생각한다css모르는데 tailwind 바로 쓰는 건 가능은 하겟지만...말이 안된다고 생각한다JS모르는데 react를 할 수 있나? 가능은 하겟지..근데 기초공사 토대공사 없이.. 2025. 5. 4. 시멘틱(Semantic)이란? - 그럼 div는 언제 쓰지? 시멘틱이라는 단어는 프론트엔드 개발자라면 한 번쯤은 들어봤을 단어다의미론적이라는 단어보다는 보통 시멘틱 태그라는 말이 더 익숙하다. 시멘틱이란 the meaning of a piece of code 코드 조각의 의미를 말한다. 즉 시멘틱이란 무엇이 보여지느냐보다는 어떤 목적 혹은 역할을 하는지를 의미한다. 단순 프론트엔드 개발에만 속하는 것이 아닌 컴퓨터 공학 전반에서 쓰이는 개념이다. 함수이름이나 변수이름을 지을 때 다들 고민하는 이유는 "어떻게 하면 더 함수의 기능을 파악하기 쉬울까?" 라는 고민에서 나온다. 이것도 시멘틱 고민의 일종이다 다음 마크업이 시멘틱 마크업의 대표적인 예라고 할 수 있다.다음의 두 태그는 보여지는 것은 동일하다. 하지만 그 의미가 다르다고 할 수 있다. h1태그를 사용하면.. 2025. 5. 2. npm 느린 건 알겠는데, 그럼 뭘 써야 할까? 프론트엔드 개발하면서 패키지 매니저 없이 개발하는 건 거의 불가능하다....가능은 하지만 굳이!Node.js 환경에서는 기본적으로 npm을 지원하고, 대부분의 라이브러리 가이드도 npm install로 시작하니까 나도 자연스럽게 npm만 써왔다. 그런데 어느 날부터인가 주변에서 이런 얘기를 듣기 시작했다.yarn이 더 빨라서 yarn 써요.pnpm도 좋던데요? 나도 yarn이 빠르다는 건 체감했지만, 도대체 왜 빠른 건지그리고 그렇다면 npm은 왜 느린 건지 궁금해졌다. 한 번은 정리하고 넘어가야 할 것 같아서 이번 기회에 npm, yarn, pnpm을 써보며 느낀 점과 각각의 장단점을 정리해봄npm이 느린 이유대표적으로 다음 세 가지가 있다.패키지를 순차적으로 설치함→ 설치할 때 병렬로 하지 않고 하나.. 2025. 4. 30. 코드잇 프론트엔드 단기심화 1주차 회고 사실 목요일에 시작해서 1주 차가 2일밖에 되진 않지만 그래도 써보는 회고록 왜 코드잇 단기심화 시작을 했는지일단 나는 집에서 공부 집중을 전혀 못 한다.그렇기에 무슨 공부를 하던 도서관 혹은 카페에서 공부를 보통 진행하는데 코드잇은 위워크라는 공간을 제공해 주어서나에게 딱 적합했다 심지어 커피도 있고 모니터도!!비록 조금은 멀긴 하지만.. 카드 발급도 좀 이상했지만... 수업은 어떻게강사님은 한분으로 예병수 강사님이 진행해 주신다9시부터 7시까지 계속....계속해서 수업 괜찮은지 물어봐주시고 중간중간 농담도 던지면서 수업해주셔서 재밌게 듣고 있다근데 아직 2일차라 뭐든 재밌음 점심시간 이후 1시간은 팀 미팅시간으로 같이 수업듣는 강의생분들과 소통하는 시간이있다.온라인으로 수업을 하다보니 다양한 지역에서.. 2025. 4. 25. Leetcode 135 - Candy (Javascript) 1-pass 방식으로 풀기 https://leetcode.com/problems/candy/description/ 문제 난이도는 hard지만 기본 풀이법은 그다지 어렵지 않은 문제라고 생각햇다... 초기 풀이법(2-pass)1. 캔디 배열 1로 초기화 -> 무조건 1개는 받아야함2. 오른쪽으로 이동하면서 1차순회3. 다시 왼쪽으로 이동하면서 캔디 개수를 업데이트/** * @param {number[]} ratings * @return {number} */var candy = function(ratings) { let candies = Array(ratings.length).fill(1) for(let i = 0; i 0; i--) { if(ratings[i] a+b, 0)}; 근데 loop를 2번을 한다는.. 2025. 4. 22. Frontend Challenge: February Edition 참가 후기! (javascript, css) + winner 선정!!!😆 dev.to 프론트엔드 챌린지 참가후기! + Winner 선정!메일을 확인하다 눈에 띈 Dev.to의 Frontend Challenge!!항상 글은 자주 읽어왔지만 이렇게 챌린지가 있는 건 또 처음 알았다!게다가 시간도 넉넉하게 남아 참을 수 없었다!!! 챌린지 내용은제공되는 HTML구성은 변경 불가능하고 js, css로만 변경가능한 챌린지였다제법 재밌을 거 같아 바로 시작! 전체적인 틀안에서 구조변경이나 레이아웃 변경은 불가능햇다하지만 자바스크립트로는 가능하기때문에하나의 html이지만 주제별로 분리하는 것이 UI/UX측면에서도 편리할 것 같아 분리하는 것으로 정했다. 분리한 페이지들을 라우터로 연결하는 것이 나을까..싶다가도 그렇게까지는 큰 의미가 없을 것 같아네비게이션 바를 만들고 display n.. 2025. 3. 7. 이전 1 2 3 4 ··· 15 다음 728x90 반응형