그로윙맨 그로윙맨

항해 99 실전프로젝트 3주가 지난 지금 그 동안에 결과물에 대한 중간발표가 있었고,그에 대한 피드백을 받고 나서 크게공허함이 왔다. 그 간 프로젝트를 진행해오면서 나는어떻게든 기능은 돌아가면 된다라는 생각으로여태까지 할 수 있는 모든 방법을 동원해서 어떻게든구현하는 방식으로 결과물을 만들어냈었다. 지금까지 현재 프로젝트에서 해온 기능은기본적인 CRUD도 있었고,회원가입, 로그인, 소셜 로그인무한 스크롤까지 구현해보았고그 중에 나름 이해하고 진행했던 것은회원가입, 로그인 , CRUD 정도였다. 나머지는 소스코드를 이용하여원하는 페이지에 가져다 붙이는 정도만 해서기능을 만들어냈다.그러다보니 나는 흐름만 파악하면 소스코드를 이용하여웬만한 기능들은 다 구현이 가능할 것이라 믿고 그렇게 진행했다. 그런데 중간발..

실전 프로젝트 2주차를 마무리하며 이번 주에는 생각보다 진도를 나가지 못했다. 부리더가 되어보니 생각보다 바쁜 일이 많아서 막상 코딩에는 손을 대기가 어려웠다. 그리고 결과적으로 기획단계에서 변화가 생기는 바람에 팀원 전체가 혼란스러웠다. 동물병원, 애견호텔 예약사이트로 방향을 잡고 진행해보니 예약기능이 있으면 실제로 병원을 갈 수 있는 서비스까지 마련했으면 하는 바램과 업체에서 등록을 해줘야하는 일이 생기는데 예약에서 이 실제적인 서비스가 없다면 우리는 런칭해본 것이 아니라 프로젝트로써 껍데기만 만들어놓는 것이기 때문에 아쉬울 것 같다는 팀의 의견이 나왔다 방향을 바꿔 실제적인 결과가 나올 수 있는 강아지 친구 매칭 시스템을 만들어 애견카페, 산책 등을 함께 할 수 있는 시스템을 추가 구현하고 이걸 메..

이번주는 실전프로젝트를 진행하는 첫 주였다. 팀의 부리더로서 함께하게 되었는데, 약간의 부담과, 설렘을 가지고 팀원들을 만나서 리더님과 내가 주도하곤 있지만 그래도 잘 따라주시고 맡은 일은 책임있게 마무리까지 해주어서 목표한 진도까진 완성했다. 물론 그렇다고 모든 게 생각대로 되지는 않았다. 기획하고나서 프론트 백이 같은 것을 얘기하고 업무를 진행하는데 서로 얘기한 내용에 대한 이해가 다르다던가 디자이너님 또한 우리 개발자들처럼 항상 함께하고 매일 보는 것이 아닌 요일을 정해서 만나고 서로 바뀐것을 소통해야하는데 그런게 바로바로 잘 안되는 문제가 생겨서 서로의 파트에서 수정하는 일이 생겼다. 그리고 아무래도 프로젝트에 대한 무게가 우리보단 덜 하니 학업도 하시면서 진행을 하고, 일정에서 1순위가 아니다보..

리액트에서 프로젝트 중 비밀번호 표시를 다른 아이콘으로 사용하고자 없애기 위해 많은 구글링을 통해서 적용하였다. 휴.. 자료가 별로 없어서 꽤나 찾기 힘들었다 또한 내가 적용한 방법은 첫 번째였는데 나머지는 리액트로 style component를 사용하고 있어서 그런지적용이 안됐다. 나처럼 이 기능을 원하는 분이 계실 것 같아서 남겨본다^^ css에 이걸 가져다 붙이면 끝이다 ::-ms-reveal { display: none; } [내가 적용한 방법은 가장 짧은 1번째 코드 ] input[type="password"]::-ms-reveal, input[type="password"]::-ms-clear { display: none; } input::-ms-reveal, input::-ms-clear { ..

Interceptor란? REST API 요청에서의 공통작업 모든 사용자들에게 오픈되어 있는 API요청도 있겠지만 많은 API들이 OAuth2 인증 후 발급받는 Access token 을 Http Header에 담아 API 접근을 하도록 요구한다. 그렇다면 일일히 API 요청할 때 Access token을 담는 작업을 해야하는 상황이 오게 된다. 이러한 상황에 적용할 수 있는 Pattern이 바로 Intercepter다. Interceptor 이름그대로 사용자의 요청을 가로채는 역할을 한다. 조금 더 세부적으로는 then이나 catch로 처리되기 전에 요청이나 응답을 가로챌 수 있다. 따라서 이를 이용하면 Axios를 이용해 API로 통신할 때 항상 사용하는 baseURL이나 headers와 같은 부분을..

리액트에 작성하는 코드량이 늘어나게 되면서 랜더링을 적절히 시켜주는 최적화에 대해서 생각하게 되었다. 아직 제대로 적용까진 하지 못하지만 조금 더 깔끔한 코드를 작성하기 위해서 리액트 훅인 useCallbacck과 useMemo에 대해 알아보기로 했다. 하지만 이 두개의 훅을 무조건 적으로 사용하는 것은 오히려 렌더링 시간에 문제를 일으킬 수 있다고 한다. 그 점은 알아두고 살펴보기로 하자. ※REACT의 리렌더링 조건 1. 자신의 state가 변경될 때 2. 부모 컴포넌트로부터 전달받은 props가 변경될 때 3. 부모 컴포넌트가 리렌더링 될 때 ex) APP.js function App() { const [number, setNumber] = useState(0); return( {setNumber(..

이번 주차는 클론코딩을 하는 주차였는데 일반적으로 하는 인스타그램, 페이스북 등을 하는 조와는 달리 우리는 사이트의 디자인부터 눈길이 가는 젠틀 몬스터라는 안경과 선글라스 관련 쇼핑몰을 대상으로 정해서 클론코딩을 하였다. 확실히 만들면서도 뷰에 신경을 많이 썻고 만들고 나서도 다른 사이트에서는 느낄 수 없는 개성과 화려함을 느낄 수 있었다. 그래서 이번 과제에서는 css에 대해 다양하게 시도해보고 메인 페이지는 미디어 쿼리를 이용하여 반응형 웹도 만들어 보고 상품 페이지에서는 정렬 방식을 다양하게 하여 사용자가 정렬방식을 변경하면 다른 형태의 상품카드를 볼 수 있게 만들어보기도 했다. 그 중에서도 가장 핵심이라고 생각했던 기능은 무려 사실 내가 맡은 기능이지만 팀원 분도 같이 하고 싶다고 하셔서 구현할 ..

수년 동안 인터넷은 소수의 기술 전문가가 비공식적인 협력을 통해 관리했다. 인터넷의 핵심 기술 대부분은 IETF ( internet Engineering Task Force = 국제 인터넷 표준화 기구) 라는 이름으로 느슨한 연합체에 의해 개발됨 IETF는 인터넷 기술의 작동 방식을 설계하고 기술 표준 문서를 만드는 단체다. 기술적인 사양은 RFC라는 문서로 상세하게 논의된다. RFC (Request for Comments)란? - RFC의 역사, RFC 종류, RFC 표준화 절차 (net-study.club) RFC (Request for Comments)란? - RFC의 역사, RFC 종류, RFC 표준화 절차 RFC (Request for Comments)란? RFC (Request for Comm..