전체 글
-
동기와 비동기_1개발공부/React 2023. 10. 17. 14:41
오늘은 동기와 비동기에 대해 공부했다. 예전 직장에 다닐 때 성능 개선을 위해 비동기 작업에 대해 공부 했던 적이 있었다. 당시에 자사 프로그램이 동기적으로 작동해서 성능 부분에서 문제가 있었기 때문이다. 그래서 개념 공부를 하고 코드 작업을 시작하려고 했는데...!! 코드를 확인한 결과 다른 팀의 선작업이 필요한 상황이었다. 아쉽게도 내가 퇴사하기 전까지 다른 팀이 작업해주지 못해서 아쉽게도 성능 개선을 끝내지 못하고 나왔던 기억이 있다. 히히.. 그렇게 시간이 지나고 프로젝트를 하게 되었는데 짧은 기간 냉 기능을 구현해야하다보니 성능면에서 아쉬운 부분이 많았다. 어떻게 하면 성능 개선을 할 수 있을지 찾아보다가 비동기 처리를 해보기로 결정했다. 우선 개념적인 부분을 다시 정리해봤다. 동기 - JS는 ..
-
렌더링 최적화_1 (React.memo)개발공부/React 2023. 10. 16. 20:06
이제부터 본격적으로 렌더링 최적화 관련된 공부를 시작할 예정이다. 최근에 진행했던 1인 가구 플랫폼 소분소분 프로젝트를 리팩토링 하기로 했다! 첫 번째 대상은 바로~! 회원가입 페이지이다. 우선 라이트 하우스를 사용해서 점수를 확인해봤다. 멘토님께서 90점 이상을 받아야지 좋은 페이지라고 했기 때문에 90점을 목표로 성능 개선을 해보기로 했다. 일단 우선 큰 문제였던 리렌더링을 해결해보려고 한다. 회원가입 페이지의 경우 입력되는 데이터 종류만 다를 뿐 동작 방식은 같아 컴포넌트를 분리해서 재사용성을 높였었다. 위에 구조로 되어 있다보니 부모가 리렌더링되면 자식도 리렌더링 되는 문제가 발생했다. 그래서 나는 React.memo를 사용해보기로 했다. 이유는 부모 컴포넌트가 리렌더링 되더라도 자식 컴포넌트가 ..
-
이노베이션캠프 2기 후기이노베이션 캠프 2023. 9. 15. 17:00
드디어어어! 짧다면 짧고, 길다면 긴 이노베이션 캠프 2기 끝!! 처음에 시작할 때는 99일이 너무 길다고 느껴졌는데 열심히 달리고 나니 정말 짧은 시간이었던거 같다. 수료 기념으로 긴 후기를 남기려고 한다!캠프 전에는 어떤 일을 했는지,왜 이노베이션 캠프를 선택했고, 어떻게 들어오게 되었는지,99일 동안 어떤 공부를 했는지 등등 자세히 작성해보려고 한다. :) 캠프 참여 전나는 대학생 때 복수전공으로 빅데이터를 했었고, 실제로 3년동안 개발 일을 했었다. 어떻게 보면 경력직이라고 할 수도 있지만, 사실 3년동안 일을 하면서 개발보다는 데이터 분석관 일을 많이 했었다.그래서 다른 사람이 "개발직이세요??" 라고 질문하면 항상 "음... 하긴 하죠..??" 라고 대답 했을 정도로...ㅎㅎ 3년간 회사를 ..
-
4 주차 회고 (주특기: 리액트)이노베이션 캠프/WIL 2023. 7. 12. 21:19
이번 주부터는 회고를 다른 형태로 작성하려고 한다. 기존에는 한 주에 어떤 일을 했었는지 적었는데, 이번 주부터는 내가 공부하면서 헷갈렸던 내용 또는 특별한 에피소드 위주로 작성할 예정이다. 컴포넌트 분리 나를 처음 당황하게 했던 내용은 컴포넌트 분리 기준이다. 컴포넌트: 사용자 인터페이스(UI)를 구성하는 빌딩 블록 기준이 명확하게 있으면 좋은데 그런게 아니다보니 폴더 구조 잡는거에서 오랜 시간을 소모했었다. 우선 순위를 어떻게 하면 좋은지? 재사용성, 기능별, 가독성 등등.. 사실 위에 모두 다 고려하면서 작성하면 좋은데 아직까지는 모든 걸 만족하는 파일 구조를 찾지 못했다..ㅎㅎ 그래서 기술 매니저님과 리액트 강의해주신 원장님께 질문 했었는데 대부분 기능(모듈), 재사용성에 중점을 두시는 거 같았다..
-
3주차 회고 (알고리즘)이노베이션 캠프/WIL 2023. 6. 27. 13:07
하하핳ㅎ 원래는 하루에 하나씩 쓰려고 했는데 내용은 뭔가 없는데 글 개수만 많아져서 그냥 한 주에 하나씩 작성하기로 했다! ㅎㅎ (이 방법이 나중에 내가 볼 때 편할 거 같아서..ㅎㅎ) 이번 주는 바로 알고리즘을 배워보는 주차이다!! 해당 글에서는 이번 주에 어떤 일을 했는지 기록할 예정! 자세한 문제 풀이는 아래 링크를 참고해주길 바랍니다. https://hani-develop-history.tistory.com/category/%EC%9D%B4%EB%85%B8%EB%B2%A0%EC%9D%B4%EC%85%98%20%EC%BA%A0%ED%94%84/3%EC%A3%BC%EC%B0%A8_%EC%95%8C%EA%B3%A0%EB%A6%AC%EC%A6%98 '이노베이션 캠프/3주차_알고리즘' 카테고리의 글 목록 ..
-
[JS] 체육복이노베이션 캠프/3주차_알고리즘 2023. 6. 21. 19:23
문제 https://school.programmers.co.kr/learn/courses/30/lessons/42862 프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요. programmers.co.kr 문제 풀이 function solution(n, lost, reserve) { // 1) 서로에게 중복되는 값 제거, 테스트 데이터에서 lost와 reserve에 중복 되는 경우 존재 let losts = lost.filter((a) => !reserve.includes(a)); let reserves = reserve.filter((a) => !lost.includes(a) ); // 2)..
-
[JS] 실패율이노베이션 캠프/3주차_알고리즘 2023. 6. 21. 17:27
문제 https://school.programmers.co.kr/learn/courses/30/lessons/42889 프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요. programmers.co.kr 문제 풀이 function solution(N, stages) { let result = []; // 1) 결과 값 저장할 변수 // 2) for문 사용하여 주어진 스테이지의 수만큼 반복 for (let i=1; i s >= i).length; // 2-1) 스테이지에 도달한 플레이어 수 let fails = stages.filter((s) => s === i).length; // 2-2) ..
-
[JS] 크레인 인형뽑기 게임이노베이션 캠프/3주차_알고리즘 2023. 6. 21. 14:37
문제 https://school.programmers.co.kr/learn/courses/30/lessons/64061 프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요. programmers.co.kr 문제 풀이 function pickDoll(arr, index) { // 인형 꺼내주는 함수 let val = 0; // 1) 인형 정보 저장할 변수 // 2) for문 사용하여 배열의 모든 요소에 접근 for (let i=0; i