일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | 5 | ||
6 | 7 | 8 | 9 | 10 | 11 | 12 |
13 | 14 | 15 | 16 | 17 | 18 | 19 |
20 | 21 | 22 | 23 | 24 | 25 | 26 |
27 | 28 | 29 | 30 | 31 |
- 미리보기
- Github Actions
- 항해99
- react
- 스파르타코딩클럽
- route
- FileReader
- rendering
- 비동기
- CI/CD
- qwe
- updater
- routing
- setstate
- useEffect
- 동기
- Redux
- 브라우저 렌더링
- imagePreview
- socket.io
- 접근 제한 라우팅
- S3
- 개발
- 채팅방
- 7기
- 배포
- previousState
- 후기
- 라우팅
- Preview
- Today
- Total
목록전체 글 (105)
삐옹
자바스크립트는 기본적으로 동기적인 언어다. 자바스크립트 엔진, 그러니까 코드를 읽을 때 위에서부터 아래로 한 줄 씩 읽으며 처리한다는 뜻이다. 여기서 일을 처리하는데 비효율성이 생겨났다. 그걸 해결해주기위해 ajax, fetch, setTimeOut 같은 것들이 나타났다. react에서는 setState가 그렇고.. 이번 파이널 프로젝트에서 실시간 채팅 기능을 넣기로 했다. 어떤 값을 setState로 업데이트 하면서 바로 그 다음 줄에 함수를 동시에 실행시켰어야 했다. 포인트는 업데이트된 값을 인자로 받는 함수였다는 것. 보기좋게 에러를 띄웠다.. 인자로 오는 값이 빈값인걸 보니 얼핏 들었던 setState의 비동기적 특성 때문에 일어난 것임을 짐작했다. 상황 1. setState()에 의해 업데이트된..
브라우저에 화면이 렌더링되는 원리에 대해 설명해주시겠어요?🧐 브라우저는 동기적으로 화면 구성에 필요한 html,css,javasript 파일들을 서버로부터 받아옵니다. 브라우저가 입력된 url에 의해 html파일을 받으면 html을 먼저 파싱하게되고 이때 DOM트리를 만듭니다. 이때 link 태그를 만나서 stylesheet를 내려받게 될 경우 CSS파싱을 통해 CSSOM트리를 만듭니다. 두 개의 트리가 완성이 되면 둘을 합쳐서 렌더 트리를 만들고, 레이아웃 작업을 통해서 사용자에게 그려줄 영역을 계산한 뒤 사용자에게 보여줍니다. javascript는 렌더링 엔진이 아닌 자바스크립트 엔진에 의하여 처리가 됩니다. 브라우저가 html을 파싱하다가 scipt 태그를 만나면 DOM트리 만들기를 잠시 중단하고 ..
이번주는 갑자기 혼자가 되어 정신없이 달렸던 주이다. 혼자라는 생각에 오히려 자신감이 붙기도 하고 용기가 생기기도 하고, 가끔은 나도 프론트 동료와 함께 개발해보고 싶기도 하고 뭐 그랬다. 그래도 분명 팀원들과 함께 잘 헤쳐나갈 것이다. 이번주 배운것 트러블 슈팅🤗 이번 주 가장 인상 깊었던 것은 항해 5기 출신인 멘토님의 트러블 슈팅 강연내용이었다. 강연 시작에 앞서 엔지니어의 중요한 덕목을 물어보셨는데, 여러 덕목 중에서도 문제 해결 능력의 중요성을 강조하셨다. 그러면서 어떤 상황에서 어떻게 문제를 해결해나가고 어떤 방식접근해가면 되는지 친절히 설명을 해주셨다. 혼자 정리해본 내용을 5가지 적어보았다. 혼자 해결 vs 물어보고 해결하는데에는 트레이드 오프가 있다. 시간이 없을 땐 고민 시간 줄이고 일..