내 경험으로 도움이 되는 (37) 썸네일형 리스트형 TIL - 18 - Keyword Canvas / Algorithm Canvas에 대한 나의 경험을 Posting 및 발표를 하였다. 코딩 테스트 준비할 때가 온 것 같다. - 오늘 하루 느낀 점 오늘 발표를 기점으로 진짜 팀 과제 일정이 끝났다. 알고리즘 개념들을 오랜만에 쭉 훑어보는데, 최근 과제만 하다 보니 머리가 굳었다. 주말에 최대한 끌어올려놔야겠다. TIL - 17 - Keyword Calendar / Date 어제 못했던 Calendar 기능들 (다중 선택 및 선택한 총 일수 계산)을 마무리 지었다. Rendering 때문에 잔상이 남는 게 자꾸 거슬렸고, 해결하기 위해서 useEffect를 최대한 안 쓰도록 코드도 고치고 컴포넌트로 빼서도 적용해봤지만, 아직 실력이 부족하여 결국 조금밖에 개선을 못 시켰다. Git Private Repo는 GitPage로 배포 시 유료라는 것을 알았다. - 오늘 하루 느낀 점 드디어 팀 과제가 전부 끝났다. 다음 주부터는 개인 과제 시작이라 기대가 된다. 실력을 더 쌓아서 좋은 사람들이 많은 회사에서 일했으면 하는 바람이다. TIL - 16 - Keyword Calendar / Date 기업 과제 중 Calendar 기능을 만드는데 생각보다 많이 어려웠다. 일반 Calendar 기능은 구현했지만, 클릭을 했을 때의 CSS 처리가 좀 까다롭다. 현재는 클릭한 날짜를 계산하여 일수 계산, 다음 월로 넘어가기 등 전반적인 기능은 끝났다. Date를 오랜만에 써서 그런지 뭔가 새로웠다. 월을 1월부터 12월까지를 0~11까지로 요일은 일요일부터 토요일까지 0~6으로 표현하기 때문에 display 할 때 유의해야 한다. - 오늘 하루 느낀 점 처음에 만만하게 봤다다 지금 시간까지도 다 끝내지 못하여 자고 이어서 하기로 했다. 이제 남은 건 거의 CSS처리뿐이라 금방할 것 같긴 하지만 생각보다 까다로워서 변수가 있을 것 같다. 라이브러리를 안쓰고 만드.. TIL - 15 - Keyword GitHub 배포/ Canvas 이미지를 CRA의 public 폴더에 저장을 했는데, 배포 시 이미지를 불러올 수 없는 상황이 발생하였다. src로 불러오는 것은 불러왔으나, url로 불러오는 과정에서는 문제가 생겨 이미지를 불러오지 못했고 아래의 그림처럼 url을 수정한 뒤에서야 이미지를 불러올 수 있었다. Git 배포 주소를 앞에다가 써주자. Canvas의 개체를 컨트롤하고 싶었는데 이게 흰 도화지에 그림을 그려 넣는 것이라 다시 지우고 새로 그리지 않는 이상은 개체로 선택할 수 없다 하여 좀 고생했다. 개체를 선택하지 못하는 대신 좌표 값이나 색을 이용하여 선택한 것처럼 이용할 수 있다고 하지만 구분자가 좌표뿐이었고, 겹치는 요소가 있을 가능성도 높아 결국 시간 내로 구현하지 못했.. TIL - 14 - Keyword Canvas Canvas Drag로 특정 영역 선택하고, 저장하기 - Quiz 정리 Q1. 브라우저 렌더링 (작동) 원리에 대해 설명하세요. A1. 전달받은 리소스 스트림을 읽으면서 HTML Parser가 HTML을 읽어나가면서 DOM Tree를 만들고 CSS Parser가 CSS를 읽어나가면서 CSSOM Tree를 만듭니다. 그리고 그 두 개를 합쳐 화면에 그려질 것만 결정하는 Render Tree를 만들고, 컴포넌트를 정렬, 배치하는 Layout 과정을 거치며, 마지막으로 Paint 작업을 통해 CSS에 설정한 대로 그려지고 화면에 출력됩니다. Q2. 웹페이지가 사용자에게 보여지는 과정에 대해서 설명하세요. A2. 1. Prompt for unload : 현재 페이지에서 다른 페이지.. TIL - 13 - Keyword JavaScript / styled-components 기업 과제를 빠르게 끝마쳤다. styled-components를 이용하여 CSS 안에 삼항 연산자 처리를 하여 속성 값을 바꾸었다. 재사용성도 뛰어나고 좋지만, 자체적으로 class name을 부여해서 그런지 막상 해당 tag를 개발자 도구로 찾으려고 할 때, 명확하게 코드에서 어느 위치에 있는 tag인지 바로 찾기가 힘들었다. 컴포넌트가 세분화되어 복잡해서 그런 것일 수도 있지만, 알아서 naming이 된다는 것에 대한 단점도 알게 되는 시간이었다. Vanilla JS로 구현하는 것도 연습이 필요할 것 같다. TypeScript도 사용해봐야 되는데.. - 오늘 하루 느낀 점 6번째 팀 과제가 끝났다. 프리온보딩 코스를 진행하면서 .. TIL - 12 - Keyword JavaScript Algorithm / props / 상태 관리 오늘은 마이다스아이티 코딩 테스트가 있어서 JavaScript로 코딩 테스트 준비를 하였다. 오랜만에 알고리즘 문제를 푸니 수준이 많이 떨어졌다. 문제도 생각했던 것보다 굉장히 어려웠다.. 히스토그램 관련 문제와 사각형을 겹치지 않게 처리하는 문제였는데 엄청났다. 상태 관리에 있어 props vs redux store를 고민하다가 props drilling 하여 관리하기로 하였다. depth가 그렇게 깊지 않아서 괜찮은 것 같지만, 아직 둘 중에 어떤 식으로 처리해야 될지 판단이 잘 서지 않는다. - 오늘 하루 느낀 점 프리온보딩 일정을 소화하면서 코딩 테스트 준비, 면접 준비, 이력서 작성은 생각보다 정신이 없었고, 다.. TIL - 11 - Keyword HashRouter / Redux Store / Github 배포 오래간만에 react-router-dom을 사용하여 routing을 하였는데, BrowserRouter로 진행하니 배포 시 문제가 생겨 HashRouter를 이용하였다. BrowserRouter로 진행하려면 서버를 React App으로 연결해줘야 함. 그렇지 않으면 404 Error가 발생 Redux의 Store에 변화가 생기면 Re-Rendering이 되는데 변수를 slice 해버려서 상태 변화 감지를 못한 Case가 발생했다. GitHub 배포가 생각보다 오래 걸렸다. (GitHub 배포 방법이 궁금하다면 보러 가기) - 오늘 하루 느낀 점 5번째 과제가 끝났다. 생각지도 못한 곳에서 시간을 너무 허비한 바람에 아쉽긴.. 이전 1 2 3 4 5 다음
