'분류 전체보기' 카테고리의 글 목록

Session vs JWT

・ Authentication(인증) : 로그인 ・ Authorization(권한부여) : 로그인 후 로그인 상태 유지 로그인 상태를 유지하기 위한 기술 : Session 또는 JWT Session: DB에 회원정보 저장, 로그인 시 유저인증하여 확인 모든 회원정보를 저장하기 때문에 관리(생성 및 탈퇴)에 용이 회원 수가 많아질수록 경우 DB가 방대해짐 JWT: DB를 거치지 않는 토큰 형식. 토큰 검증으로 로그인하기 때문에 암호화되지 않음 토큰이 만료되기 전까지 유효하여 강제탈퇴 등의 기능 사용 불가 DB를 사용하지 않기때문에 속도 빠름 세션(Session)과 JWT 🔎 Authentication vs Authorization 두 개의 단어는 비슷해보이지만 엄연히 다른 프로세스이다. Authentica..

Developer/Network 2023. 10. 9. 09:10

프론트엔드 공부루틴 만들기

개발 공부를 시작하기 앞서 중장기 목표와 계획을 정하고 공부 루틴을 만들기 위한 첫 발걸음을 시작해보자 이유: 프론트엔드로서의 성장 및 이직준비 중기 목표: 짱짱맨 사수되기 장기 목표: 연봉 올려서 이직하기 할일 목록 기본 개념: 면접 질문 답변 공부 업무 코드 리팩토링: 서적(클린코드, 리팩토링) 또는 스터디 활용 OS 및 네트워크 지식: 동시성, 메모리 관리, 프로세스 vs 스레드, TCP/IP, HTTP 등 웹 개발 관련 공부: React, Next, TypeScript, Redux, React-Query 등 네트워킹 활용: IT 커뮤니티 및 뉴스레터 등 기술면접 대비: 알고리즘 및 자료구조 사이드 프로젝트 세부계획 출퇴근 시간을 활용하여 하루에 하나씩 정리해서 포스팅 → 면접 질문 및 답변 3개 ..

Developer/Front-end 2023. 10. 7. 19:45

프론트엔드 면접준비2: 면접 질문 목록

기본적인 개발 지식과 알아두면 플러스요인인 면접 질문의 대해 정리해보자 HTML이란 Hyper Text Markup Language에서 Hyper Text와 Markup Language의 의미 CSS (Cascading Style Sheet)에서 캐스케이딩의 의미 Proceed와 Thread의 차이 동기와 비동기의 차이 비동기를 처리하는 방법 SSR과 CSR의 차이 React 라이브러리가 생겨난 이유 React에서 가상돔의 역할과 생성 이유 RESTful API이란 프론트에서 보안을 신경써야할 점들은? JavaScript에서의 이벤트(함수) 처리 방식 기타 JS 관련 질문 클로저 호이스팅 브라우저 동작방식 이벤트 버블링/캡처링 이벤트 델리게이션 실행/함수 컨텍스트 원시타입/참조타입 Call by valu..

Developer/Front-end 2023. 10. 7. 19:02

프론트엔드 면접준비1: 자격요건, 우대사항

채용공고에서 많은 기업들이 공통적으로 원하는 프론트엔드로서 갖춰야할 필수요인 및 플러스요인을 정리해보자 프론트엔드 지식으로 유저경험 혹은 개발자 경험을 향상시킨 이야기를 해줄 수 있는 분 Webpack, Browserify, Vite, ESBuild 등 번들러 툴 기반 개발 경험 있는 분 Redux, Recoil 등 상태 관리 개발 경험 있는 분 Next.js 등 SPA Framework를 이용한 SSR 프로젝트에 경험이 있는 분 도메인 문제를 해결하는 것에 관심이 많고 실행하는 분 AWS를 활용한 웹 어플리케이션 개발 경험이 있는 분 AWS 환경에서의 CI / CD 경험이 있는 분 렌더링 최적화 등의 프론트엔드 성능 개선 지식 및 경험이 있는 분 RESTful API와 HTTP 요청 및 응답에 대한 이..

Developer/Front-end 2023. 10. 7. 15:26

퍼블리싱 팁 대방출

웹퍼블리셔 경력자가 정리한 실무에서 사용하는 코딩 메모장 폰트 x 라인하이트 구하기 : http://pxtoem.com/ 어플에서 새창으로 열리는 이슈 a href="javascript:void(0);" -> a onclick="return false;" 메일: test@www.co.kr 전화: 02-123-123 커서 방지: cursor: text; 다운로드: download="" 얼럿창 스와이퍼 다음 슬라이드 노출 loopAdditionalSlides : 1, 다중 탭 내에 스와이퍼 (참고: https://sir.kr/qa/364981) observer: true; observeParents: true; 스와이퍼 방향 반대로 페이지 이동 소스 테이블 초기화 table { width:100%; bord..

Web/Publisher 2023. 8. 26. 16:51

유용한 참고 사이트를 알아봅시다!

제이쿼리 API참고: https://jquery.com/ 기능참고: http://www.htmldrive.net/ 프로토타입(벡터): https://www.figma.com/ 참고사이트: http://www.gdweb.co.kr/ 트윈맥스: https://greensock.com/ 글자 쪼개주는 사이트: https://splitting.js.org/ fullpage.js: https://alvarotrigo.com/fullPage/ko/ pagepiling.js: https://alvarotrigo.com/pagePiling/ particles.js: https://vincentgarreau.com/particles.js/ 필터,정렬: https://isotope.metafizzy.co/ 이미지 정렬: ..

Web/Publisher 2023. 8. 26. 16:36