전체보기239

• [프론트엔드 테스팅] Yoni Goldberg의 JavaScript Testing Best Practices javascript-testing-best-practices/readme.kr.md at master · goldbergyoni/javascript-testing-best-practices 📗🌐 🚢 Comprehensive and exhaustive JavaScript & Node.js testing best practices (July 2023) - goldbergyoni/javascript-testing-best-practices github.com 이 GitHub README는 내 즐겨찾기에 들어 있은지는 오래 되었지만 처음으로 꺼내보게 되었다. 만 1년차 개발자가 되고 나서부터 가장 크게 달라진 점이 있다면 테스트 코드를 작성하고 있다는 것인데, 막상 테스트를 짜다 보면 어떤 원칙을 따라야 할지 .. 카테고리 없음 2024. 4. 15.

• 2024년 2-3월 회고: 재미있는 코드리뷰, 테스트 코드, 4-1학기 개강, 예산 여행, 아두이노 실습, 장충 배구장, 잠실 야구장, 신기능 - 2 신기능 개발이 끝나고 조금은 여유 있던 2월과 3월! 주로 개발 팀 내에서 곧바로 해결하지 못하고 Todo로 남겨 두었던 버그들을 고치고, Google Tag Manager에 대해서 배우고, WordPress 관련 개발도 하는 등 좀 더 호흡을 길게 가져갈 수 있는 일들을 하면서 여유 있는 시간을 보낼 수 있었다. (물론 MUI 코어와 관련된 버그여서 절대적인 시간은 많이 들었다 ^^; 그래도 AI가 하기 힘든 영역이 아직은 있구나 싶었던 ㅋㅋㅋㅋ) 그래서 올라오는 거의 모든 MR을 리뷰하고, 몇 가지 컴포넌트에 테스트 코드를 추가할 수 있었다. 그 과정에서 정말 많이 배웠고 테스트 커버리지를 높일 수 있었다. 3월 말 쯤에는 약간의 팀 변동이 있었고, 그 때문에 새로운 기능 개발에 중간 투입되어서 조금.. My/Riverlog 2024. 3. 31.

• 

  [HTML]  (non-breaking space, 줄 바꿈 없는 공백)이란? FE 개발을 하다 보면 JSX나 HTML에 명시적으로 공백을 표시해야 할 때가 있다. 텍스트 요소 길이가 너무 길 때 줄을 바꾸고 그곳에 nbsp를 쓰는 식이다. nbsp가 정확히 무엇을 의미하는지와 사용해야 하는 경우, 사용하면 안 되는 경우를 알아 보았다. 1. nbsp란? nbsp는 사실 공백을 표시하는 데 쓰는 것이 아니다. 하지만 공백의 역할을 한다. nbsp를 쓰면 공백이 표시됨과 동시에 그 위치에서는 줄 바꿈이 일어나지 않아 그 이전 공백이나 이후 공백에서 줄 바꿈이 일어나게 한다. 그러니까 극단적으로 한 p 태그 안의 모든 공백을 nbsp로 대체해 표시하면, p 태그의 콘텐츠가 p 태그를 감싸고 있는 div의 오른쪽 바깥을 한 줄로 뚫고 나가게 된다. 줄 바꿈 없는 공백을 HTML이 인식할.. Programming/HTML, CSS 2024. 3. 26.

• 

  2024년 1월 회고: 만 1년차 개발자 되다, 사이드 프로젝트, 계절학기, 이메일 개발, 멘토링, 웹 접근성 교육, 의자 구매, 팰월드, 토플 준비 1월은 사이드 프로젝트 MVP를 개발하느라 퇴근 후 거의 모든 시간을 쓴 것 같다. 그래서 이제야 1월 회고를 쓸 여유도 생겼다. 회사에서도 몇 가지 까다로운 버그와, 처음으로 이메일 관련 개발을 하게 되어서 이메일 클라이언트 별 대응 방법(Gmail for iOS는 style 태그 안 font family 조차 무시하고 Times New Roman으로 기본 적용을 해 버리고는 한다... sans serif 추가 필수 ^^;)에 대해 공부하느라 바빴다. 다행히 사이드 프로젝트도 완벽하진 않지만 핵심 기능을 완성했고, 이메일 관련 기능도 기한 내에 완료할 수 있었다. 또 웹 접근성 툴 WAVE를 만든 유타 주립 대학의 WebAIM으로부터 직접 웹 접근성 교육을 들을 기회도 있었다. 새벽 시간이어서 집중이 .. My/Riverlog 2024. 2. 15.

• 

  [HTML] <a> 태그 'target' 요소 target 요소는 주로 _blank를 사용해서 새로운 탭에서 페이지를 열려고 할 때 말고는 사용한 적이 거의 없었다. 하지만 이번에 기능 하나를 개발하면서 다른 요소를 사용해야 하는 경우를 만나서 mdn을 보고 정리해 보았다! 의미 target 요소는 링크한 URL을 표시할 '위치'를 말한다. 위치는 브라우징 맥락을 말하는데, 탭, 창, 의 이름 등이 될 수 있다. target 요소에는 총 네 가지 값이 들어갈 수 있다. _self: URL을 현재 브라우징 맥락에 표시한다. (기본값) _blank: URL을 새로운 브라우징 맥락에 표시한다. 보통 새 탭이지만, 사용자가 브라우저 설정을 통해 새 창으로 바꿀 수 있다. _parent: URL을 현재 브라우징 맥락의 부모에 표시한다. 부모가 존재하지 않으면.. Programming/HTML, CSS 2024. 1. 27.

• 

  [WIP] [JavaScript] 모던 자바스크립트 Deep Dive 02장 자바스크립트란? 비록 다른 객체지향 언어와의 차이점에 대한 논쟁이 있긴 하지만 자바스크립트는 강력한 객체지향 프로그래밍 능력을 지니고 있다...상속, 정보 은닉을 위한 키워드가 없어서 객체지향 언어가 아니라고 오해하는 경우도 있지만 자바스크립트는 클래스 기반 객체지향 언어보다 효율적이면서 강력한 프로토타입 기반의 객체지향 언어다. -p.15 브라우저와 Node.js 모두 자바스크립트의 코어인 ECMAScript를 실행할 수 있지만 브라우저와 Node.js에서 ECMAScript 이외에 추가로 제공하는 기능은 호환되지 않는다. -p.17 03장 자바스크립트 개발 환경과 실행 방법 간단한 웹 애플리케이션은 브라우저만으로도 개발할 수 이싿. 하지만 프로젝트의 규모가 커짐에 따라 React, Angula.. Programming/Javascript, Typescript 2024. 1. 2.

• 

  2023년 회고 일 회고만 1년차 개발자가 되다이번 달로 만 1년차 개발자가 되었다. 처음 프로그래밍을 공부한 시점으로부터는 2년차다. 아직도 내가 수 년, 수십 년 경력을 가진 개발자들과 한 회사에서 일을 하고 있다는 것이 신기하지만, 이제 정말 주니어 마인드를 버리고 문제 해결을 위해 더 적극적으로 나설 때라는 생각이 드는 요즘이다. 이 고비를 잘 넘기고 진짜 전문가가 되어 가는 길을 걷고 싶다.첫 회사에서의 5개월과 두 번째 회사에서의 5개월예상치 못한 이직을 하면서(이직 관련 포스팅) 일 년 중 반은 국내 SI 회사에서, 나머지 반은 외국 서비스 회사에서 개발자 생활을 하게 되었다. 백엔드부터 애니메이션까지 다양한 기술을 제품에 적용해볼 수 있었고, 시간 압박 속에서 신기능을 런칭하는 경험도 해봤다. 자주, 솔직.. My/Riverlog 2023. 12. 27.