분류 전체보기79 2024.06.12 76일차 React 컴포넌트, props, 이벤트 바인딩 React.js 컴포넌트 기반 아키텍처가상 DOM → 리렌더링 성능 향상선언적 접근 방식- 상태가 어떻게 변화하는지, 그리고 그 변화에 따라 어떤 UI가 보여야 하는지를 정의 강력한 커뮤니티와 생태계 React 개발환경윈도우 기준 win + r → cmd (터미널) 실행 후 아래 코드를 차례로 입력node.js, npm 먼저 설치되어 있어야 하므로 -v로 버전이 잘 출력되면 react 설치 진행// 설치 확인node -vnpm -v// react 초기 환경 설정 npm install -g create-react-app// react 프로젝트를 만들 디렉토리로 이동 (ex. cd Desktop)// npx [설치한거] [프로젝트명] npx create-react-app react-study 인텔리제이 .. 2024. 6. 12. 2024.06.10 74일차 SPRING 카카오로그인 API 카카오 로그인 API 🔗 카카오 로그인 https://developers.kakao.com/product/kakaoLogin 최근에는 직접 사이트에 회원가입 하기 보다는 SNS 로그인을 많이 사용하고 있다.그중 카카오 로그인 API를 통해 기본적인 REST API 사용법을 공부했다. 기본 설정카카오 디벨로퍼스로 들어가 로그인한 뒤 내 애플리케션으로 가서 API를 적용하고자 하는 앱을 추가해준다. 추가한 앱에서 기본적인 설정이 필요하다.- 카카오 로그인 ON, Redirect URI는 필수로 설정하고 Redirect URI는 개발 시 필요하므로 오타 주의!- 앱 권한에 대한 보안이 강화되어 닉네임, 프로필 사진 정도만 기본적으로 가져올 수 있고 다른 정보는 앱 권한 신청 및 심사가 필요하다. .. 2024. 6. 10. 2024.06.05 73일차 SPRING 파일 업로드 - 동기 파일 업로드파일을 API, 서버로 동기, 비동기 두 가지 방식으로 전달 가능 (FileReader는 비동기) - 동기 방식 : form 태그 버튼 클릭 (submit 기능 사용)- 비동기 방식 : fetch, 드래그 앤 드롭으로 실시간 업로드 파일 업로드 화면 처리input type="file"multiple : 여러 파일을 한번에 업로드 가능 (input 태그 여러개 사용을 권장)accept="MIME TYPE" : 업로드할 파일의 확장자, 타입 지정 가능form encype="multipart/form-data"** MIME type : 데이터마다 정해진 타입과 형식 표현 ( type/subtype ) - type은 discrete(단일), multipart (다중)으로 나뉨 ex.. 2024. 6. 5. 2024.06.04 72일차 SPRING 좋아요, 댓글권한 게시글 - 좋아요 싫어요 기능회원 : 게시글 = M:N → tbl_reaction 테이블 생성엔터티 클래스, Mapper.java, service 작성controller는 게시글 컨트롤러에서 ** ERD로 테이블 관계 설계 및 확인 더보기- MySQL workbench -- 상단 메뉴 database - reverse engineer - 인텔리제이 로직리액션 상태 : 1. 아무것도 누르지 않은 상태 2. 좋아요 3. 싫어요리액션 생성 : 좋아요, 싫어요 처음 클릭 (INSERT)리액션 삭제 : 좋아요, 싫어요 취소 시 삭제 (DELETE)리액션 조회 : 회원의 특정 게시물 관련 리액션 로그가 있는지 확인(SELE.. 2024. 6. 4. 이전 1 2 3 4 ··· 20 다음
