본문 바로가기

프론트엔드24

[프론트엔드] ajax & axios 개인적으로 늘 잘하는 시니어 개발자가 없는 환경에서 홀로 모든 걸 주도적으로 판단하고 처리 해온 입장에서 학습과 평가를 위해서 코딩 테스트, 과제 테스트 등의 기회가 있을 때마다 주기적으로 참여해왔다. 과제 테스트의 경우 검색이 허용 되는 경우가 대부분이지만 레퍼런스를 제외하고는 검색을 제한하는 방식으로 (모르는 게 있거나 기억나지 않으면 그냥 0에서부터 구현하기) 주로 참가해왔는데 이번 프로그래머스 데브 매칭의 경우 바닐라 js로 기본적인 dom제어와 클라이언트 라우팅 그리고 ajax를 아예 처음부터 만들어야 했다. 그 과정에서 ajax를 통해서 fetch로 기본적인 api형태를 만들다가 엄청 헤매면서 시간을 허비하게(대략 20분) 되는데 평소 ajax의 경우 axios를 통해서 처리하다 보니 fetc.. 2021. 9. 16.
프론트엔드 관련 링크모음 1 https://medium.com/class101/%EC%97%94%ED%84%B0%ED%94%84%EB%9D%BC%EC%9D%B4%EC%A6%88-%ED%94%84%EB%A1%A0%ED%8A%B8%EC%97%94%EB%93%9C-%EC%95%A0%ED%94%8C%EB%A6%AC%EC%BC%80%EC%9D%B4%EC%85%98-%EC%95%84%ED%82%A4%ED%85%8D%EC%B3%90-79eef2e30c77 엔터프라이즈 프론트엔드 애플리케이션 아키텍쳐 소프트웨어의 수명과 복잡도는 대개 비례 관계입니다. 아무리 정교하고 아름답게 코드를 작성해도, 시간이 지날수록 코드베이스는 복잡해지기 마련입니다. 그래서 우리는 이런 문제들을 마법 medium.com https://fe-developers.kakao.. 2021. 7. 12.
프론트엔드 설계 및 디자인 패턴 프론트엔드를 혼자 공부하고 개발하면서 개인적으로 효율적이라고 생각하고 만든 구조중 하나입니다. CSR 기준으로 되어 있습니다. # 리액트 & 웹팩 설정 ### 루트 1. root - 패키지 매니저, 깃, 웹팩, 기타 플러그인 설정이 위치한다. 2. build - 웹팩 세부 설정 & 플로그인등 셋팅이 존재한다. 3. public - 정적파일 보통 index.html이 존재한다. 4. src - 개발한 모든 소스가 존재한다. 5. dist - 웹팩을 통해서 빌드된 프로덕트 소스가 존재한다. 6. etc - types, .storybook 등 폴더가 선택적으로 존재한다. ### SRC 1. assets - 정적 리소스, img나 웹폰트등이 존재한다. 경우에 따라서 css나 js 파일도 있을 수 있다. 2. c.. 2021. 6. 28.
브라우저 렌더링 관련 링크모음 1. [스압/데이터주의] 웹 최적화 방식 모음 - 3. Layout 및 렌더링 :: BlaCk_Log (tistory.com) [스압/데이터주의] 웹 최적화 방식 모음 - 3. Layout 및 렌더링 [스압/데이터주의] 웹 최적화 방식 모음 - 0. 전반적 원칙과 원리 [스압/데이터주의] 웹 최적화 방식 모음 - 1. 다운로드 [스압/데이터주의] 웹 최적화 방식 모음 - 2. 파싱 및 렌더링 트리 [스압/데이 black7375.tistory.com 2. https://medium.com/@cwdoh/%ED%94%84%EB%A1%A0%ED%8A%B8%EC%97%94%EB%93%9C-%EA%B0%9C%EB%B0%9C%EC%9E%90%EB%A5%BC-%EC%9C%84%ED%95%9C-%ED%81%AC%EB%A.. 2021. 6. 25.