본문 바로가기

프론트엔드27

[프론트엔드] ajax & axios 개인적으로 늘 잘하는 시니어 개발자가 없는 환경에서 홀로 모든 걸 주도적으로 판단하고 처리 해온 입장에서 학습과 평가를 위해서 코딩 테스트, 과제 테스트 등의 기회가 있을 때마다 주기적으로 참여해왔다. 과제 테스트의 경우 검색이 허용 되는 경우가 대부분이지만 레퍼런스를 제외하고는 검색을 제한하는 방식으로 (모르는 게 있거나 기억나지 않으면 그냥 0에서부터 구현하기) 주로 참가해왔는데 이번 프로그래머스 데브 매칭의 경우 바닐라 js로 기본적인 dom제어와 클라이언트 라우팅 그리고 ajax를 아예 처음부터 만들어야 했다. 그 과정에서 ajax를 통해서 fetch로 기본적인 api형태를 만들다가 엄청 헤매면서 시간을 허비하게(대략 20분) 되는데 평소 ajax의 경우 axios를 통해서 처리하다 보니 fetc.. 2021. 9. 16.
펫링크 마이그레이션 후기 펫링크 마이퍼피 펫링크 관련 설명. 인수인계 및 리팩토링시 참고해서 진행바랍니다. 기술 구성 해당 프로젝트는 기존의 PHP 코드 이그나이트, 부트스트랩, 제이쿼리 기반, 멀티페이지 어플리케이션을 리액트로 마이그레이션 진행한 프로젝트입니다. 프로젝트 환경 설정 과정에서 개인적으로 작성한 웹팩 템플릿을 사용했습니다. 적용된 기술스택: React, TypeScript, Axios, Redux, Redux-saga, Bootstrap(react), C3, React-hook-form, React-quill, React-select, React-tooltip, Signature_pad, Styled-components, React-circular-progressbar, React-daumpost-hook, Web.. 2021. 7. 8.
프론트엔드 설계 및 디자인 패턴 프론트엔드를 혼자 공부하고 개발하면서 개인적으로 효율적이라고 생각하고 만든 구조중 하나입니다. 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.

티스토리툴바