기업 기술블로그의 Frontend 관련 글 580개
프로젝트가 시작된지 얼마 되지 않은 경우에 소스는 비교적 일관성을 가지고 있습니다. 하지만 시간이 지남에 따라 여러 사람이 참여하고, 비슷한 새로운 프로젝트가 만들어지면서 점점 일관성이 떨어지게 됩니다. (문서나 리뷰 과정이 있으면 비교적 낫지만, 완전히 방지하기는 어려운 것 같습니다) 또한 새로운 기술이 생기면서 (예를 들어 React Hook) 기존에 설정한 구조가 전혀 적합하지 않게 되는 경우가 생깁니다. 그런 의미에서 주기적으로 프로젝트
Component Test를 작성하여 훨씬 더 간단하고 유지 관리하기 쉽고 다른 구성 요소와 함께 사용하고 재사용하기 쉬운 UI 구성 요소를 만들 수 있습니다. 이 과정에서 테스트를 작성하고, 테스트를 통과하는 코드를 작성하고, 작성한 코드를 리팩토링하는 과정을 반복하게 됩니다. 이번 글에서는 todo list 코드를 일부 작성해보겠습니다. 1. Setup Next.js 11.0.1을 사용하고 있습니다. npm install --save-dev
“혹시 이 부분 모달말고 논모달로 처리해주실 수 있나요?” 어느날 이런 수정요청이 왔고 … 신입 디자이너는 구글링을 하기 시작했습니다. 부끄럽지만, 이 계기로 한 단계 더 발전하고 나아가고자 모달 관련 글을 남겨봅니다 :/ 모달(Modal) VS 팝업(Pop-up) “여기 이렇게 팝업 띄울까요?” “이 부분은 모달로 처리하면 될 것 같은데요” 모달 == 팝업 이라고 생각하고 아무렇게나 혼용하며 소통하곤 했던 나 ㅎㅎ..ㅋㅋ..! 팝업과 모달은
파일럿 프로젝트 줌인터넷 서비스개발팀 프론트엔드 파트 주니어 개발자들(재민, 도경, 정훈)이 수습 기간 동안진행했던 파일럿 프로젝트 입니다. 진행된 프로젝트는 GitHub 레포지토리에서 확인하실 수 있습니다. 목차 프로젝트 개요 1.1 프로젝트 주제 1.2 요구사항 1.3 프로젝트 기능소개 협업 방법 프로젝트 구조 3.1 프로젝트 전체 구조 3.2 패키지별 구조 3.3 Backend 구조 3.4 Frontend 구조 3.5 common 구조 기
안녕하세요, 똑똑한개발자에서 프론트엔드 개발을 하고 있는 Anne입니다. 이번에 프로젝트를 하면서 차트를 그리기 위한 용도로 Chart.js를 사용하게 되었습니다. 워낙에 기능도 많고 괜히 복잡해보여서(구현하려는 기능에 따라 뒤에 복잡한 부분이 분명 있기도 합니다만…😌) 선뜻 시작하기가 어려웠습니다. 뭐든 시작이 제일 어려운 법인데, 이번 시간에는 저처럼 차트를 ‘구현해야만’ 하는 상황에서 Chart.js를 “덜 어렵게” 시작할 수 있도록 C
안녕하세요, 똑똑한개발자에서 프론트엔드 개발을 하고 있습니다.👋 똑똑한개발자 똑똑한개발자 프론드엔드 팀은 매주 월요일 오후에 javascript 기초에 대한 스터디를 진행하고 있습니다. 자바스크립트의 핵심적인 기본개념과 동작원리에 대해 스터디 구성원 한 사람이 파트 1개씩을 맡아 간단하게 발표하고 그에 대한 의견들을 공유하고 나누는 형태로 진행합니다. 첫 시간에는 자바스크립트의 ‘데이터’와 ‘불변성’에 대해 간략하게 알아보는 시간을 가졌고 이
상태 관리 jotai 과거에는 상태 관리를 위해 당연하듯 Redux를 고려했었는데 리액트 v16.8의 hook의 등장 이후로 많은 선택지가 생겨나게 되었고 이에 따라 저희 역시 새로운 시도에 대한 고민을 해왔습니다. 자료를 조사해가던 중 Jotai라는 상태 관리를 언급한 문장을 보았습니다.
본 포스트는 기술적인 내용이 아닌, 주니어 개발자인 필자가 함께 일하게 될 신입 개발자 분들을 모시는 과정에 대해 소개하는 글입니다. 1. 변화, 그리고 모집 올해 들어 줌인터넷에는 굉장히 많은 변화가 있었습니다. 먼저 줌 닷컴의 대대적인 개편이 있었습니다. Spring Boot 로 작성 된 레거시 프로젝트를 버리고, nodejs + vuejs 를 적용하면서 거의 모든 것을 갈아엎었습니다. 개편 전 줌닷컴 현재 줌 닷컴 그리고 줌 닷컴의 개편을
여러분 안녕하세요💚 올리브영 모바일 앱에서 안드로이드 개발을 담당하고 있는 의지수입니다. 오늘은 5월달에 열렸던 Google I/O 2021에서 소개된 안드로이드12에 관한 이야기를 해보려 합니다. Google I/O 2021 Google I/O…
롬 리서치(Roam Research)는 동명의 회사에서 개발하고 서비스하고 있는 그래프 기반의 노트 애플리케이션입니다. 롬 리서치는 2019년 10월 베타 버전을 런칭하고 2020년 6월 유료 플랜을 공개했습니다. 노트를 연결하고 편집하는 기능이 다른 노트 애플리케이션에 비해서 특출나게 편리해서, 일부 유저들 사이에서 큰 인기를 끌고 있습니다.
토스 서비스의 개발사 비바리퍼블리카에서는 개발자 컨퍼런스 Slash 21 컨퍼런스 사이트를 오픈하고, 사전 예약 신청을 받고 있습니다. 이번 컨퍼런스는 4월 28일부터 30일까지 3일 동안 열리며, SRE, 모니터링, 테스트, 프론트엔드, 자바스크립트(JavaScript), 데이터베이스, 슬랙봇 등을 주제로 3일간 총 19개 세션이 예정되어있습니다.
Web Component 이 글은 Web Component 에 대한 소개의 글은 아닙니다. 이를 위한 Custom Element 나 Shadow DOM 의 기술을 설명하는 글도 아닙니다. 이 글에서는 transclude 한 컴포넌트 디자인이 어떤 의미를 지닐 수 있는지를 논의해보고 싶습니다. 자바스크립트나 함수적인 프로그래밍에 익숙한 분들은 클로져나 람다 등에 익숙하실 것 같습니다. 제가 느끼기에 transclude 는 이런 기술들의 근본과 차이가 크지 않으며 이를 통한 활용이 좀 더 높은 추상화를 가능하게 도와주는 도구라고 생각합니다. Web 에서 가장 많이 사용되는 element 는 컴포넌트 일 것입니다. 이 요소는 매우 단순한 요소인데 어떻게 많이 쓰이면서도 요소가 제공하는 요구사항을 더 추가하거나..
안녕하세요. API 개발팀 이정준 입니다. ECMAScript6 에서 class가 추가되었습니다. Class Function과 Factory Function의 차이를 알아보고, 어떤 Function을 사용할지 생각해 봅시다. 1.기본 사용 방법 기본 사용 방법은 다음과 같습니다. Class Function class TodoModel { constructor(data) { this.todos = []; this.data = data; } add
안녕하세요. 프론트엔드 개발을 하고 있는 gyu입니다. 어반베이스에서는 현재 운영되고 있는 서비스들의 화면과 기능을 개발하고, API 적용, 3D SDK 개발 등의 업무를 진행하고 있습니다. 서비스를 개발하고 운영하면서 꼭 필요했던 클라이언트의 에러 로그 트래킹 시스템 도입기를 정리해보았습니다. 클라이언트 사이드 에러 로그 트래킹이 필요한 이유? SPA(Single Page Application) + CSR(Client Side Renderin
페이지 30 / 33 (총 580개)
