개발 (4) 썸네일형 리스트형 Technical challenges in Teo Sprint '나랑 벚꽃 보러 가지 않을래?' 스프린트 프로젝트에서 내가 겪었던 기술적인 도전들을 적어보려고 한다. 1. Tainted Canvas 스프린트를 하는 과정에서 아이폰에서 초대장 생성이 안 되는 이슈가 있었다. 유저가 만든 화면으로 canvas를 생성하고 그것을 url로 바꿔 firebase에 전달하는 로직에서 발생한 이슈였다. 내가 짰던 코드가 아니었기 때문에 코드를 찬찬히 뜯어봤는데 비동기 처리 부분이 뭔가 이상했다. 코드를 동기적으로 처리하기 위해 setTimeout을 사용하고 있었다. await가 제대로 동작하지 않아 시간이 없어 setTimeout을 사용했다고 예전에 들었던 것 같다. 이 문제가 firebase의 비동기 처리 부분에서 일어난 문제라고 생각해 await 코드로 바꿔보기로 했다. s.. Context API 이번 글은 전적으로 velopert 님의 블로그 글을 참고했습니다! 해당 블로그 글을 보고 공부하며 메모한 부분과 약간의 생각을 첨부했습니다. 참고 링크는 글 하단에 명시했습니다. Context는 리액트 컴포넌트 간에 어떠한 값을 공유할 수 있게 해주는 기능이다. 주로 전역적인(global) 값을 다룰 때 사용하지만 꼭 전역적일 필요는 없다. Props가 아닌 또 다른 방식으로 컴포넌트 간에 값을 전달하는 방법인 것이다. Props로만 값을 전달하면 컴포넌트들 간의 depth가 깊어질 수록 Props Drilling이 심해진다. props를 전달하는 과정에서 실수할 수도 있고, 부모-자식 간이 아닌 형제 컴포넌트 간에는 값의 공유가 어려워진다. Context를 사용하면 이런 어려움들을 해결할 수 있다. .. 테오의 스프린트 14기 기술 회고 이번에 테오 스프린트 14기에 참여하며 구글 스프린트(커스텀 by 테오)라는 협업 방식이 어떤 것인지 맛 볼 수 있었다. 새로운 아이템을 서비스로 만들어내는 데는 내가 접해본 방식들 중 최고라고 생각할 만큼 효과적이었다. 어떤 점이 좋았는지, 다음에 보완해야 할 점은 무엇인지 등의 스프린트 자체에 대한 회고는 피그잼과 개인적인 일기에 적었다. 때문에 오늘은 기술적으로 복기할 만한 점들을 회고해보도록 하겠다. 맡았던 부분 우리 아이디어는 벚꽃 시즌에 맞춰 초대장을 작성하고 꾸며 그것을 공유할 수 있는 웹 서비스다. 최근에 간단한 CRUD 말고 색다른 기능을 개발해보고 싶다는 생각이 들어 Interactive Developer의 코드를 따라해보는 등의 시도를 했었다. 같은 이유로 캐릭터/스티커를 드래그앤드롭.. DocumentFragment와 Dollar sign($) 변수명 프로젝트 시작 전, 공부했던 자바스크립트를 다듬을 요량으로 우아한 테크코스 프리코스 과제를 수행해보고, 다른 사람들의 코드도 보고 있다. 보통 우테코 과제는 1, 2차는 숫자야구, 자동차 경주이고 3차가 바뀐다고 한다. 3차 과제가 무엇이었는지 확인하기 위해 검색하던 중 지난 4기 우테코에 프론트엔드로 지원하고 합격한 사람의 블로그를 발견했다. compy (Ryu Hyun Seung) - velog velog.io 개발을 오래해보신 분 같고, 프리코스 과제를 수행하며 겪은 과정을 상세히 적어있기에 정독하며 공부했다. 저분의 코드를 보며 모듈 혹은 특정 코드를 이런 식으로도 짤 수 있구나! 라는 깨달음을 얻었다. 두 가지 정도로 요약할 수 있다. 1. DocumentFragment 먼저 document.c.. 이전 1 다음
