개인프로젝트 회원가입 - User 모델 만들기 java에서 object를 만들면 object를 기반으로 테이블 생성 application.yml에서 ddl -> update => data를 insert하고 서버를 재실행 해도 data 유지 -> create => 서버를 재실행 하면 insert한 data 사라짐... 개인프로젝트SpringbootSpringboot React simple diary - 데이터 추가 App.js DiaryEditor.js App.css 실행 화면 App컴포넌트가 DiaryEditor 컴포넌트와 DiaryList 컴포넌트가 함께 사용할 일기 data를 State로 가지고 있는데 일기 data는 빈배열([])로 시작을 하고 일기 상태변화 함수인 setData가 있다 DiaryList 한테는 현재 App컴포넌트가 가진 일기 배열 state의 data를 넘겨주기만 하면 된다 새... 개인프로젝트개인프로젝트 [React + Node.js] 간단한 게시판 만들기 해당 댓글을 등록한 사람만 삭제를 할 수 있습니다. 회원가입 또한 axios 를 이용해 서버와 POST 요청으로 데이터베이스에 해당 계정이 있는지 확인 후 , 가입 여부를 결정했습니다. 물론 배열와 페이지 값은 State에 저장되어있어, 서버에서 값을 가져올 때 쉽게 갱신될 수 있게 했습니다. 우선 리스트에서 각자 부여한 url string 를 이용해 데이터베이스에서 각 페이지에 해당하는 페... Reactnode.js개인프로젝트React React simple diary 프로젝트 3 DiaryList.js App.js DiaryItem.js App.css 실행화면... 개인프로젝트개인프로젝트 React simple diary 프로젝트 2 다른 파일은 이전 진행사항과 동일 DuaryEditor 실행 화면 author에 입력 글자 1글자 이상 content에 입력 글자 5글자 이상이 되어야만 글 등록이 가능하고, 두 조건을 만족 하지 않으면 focus기능을 활용해 입력란이 bold해 지는 효과를 주었음... 개인프로젝트개인프로젝트 React simple diary 프로젝트 DiaryEditor.js 코드 App.js 코드 App.css 코드 실행 화면... 개인프로젝트개인프로젝트 React Emotion Diary - 배포준비 <페이지별로 사이트 이름 바꾸기> <페이지 아이콘 바꾸기> public-favicon으로 변경 가능... 개인프로젝트개인프로젝트 React Emotion Diary - Home <홈> Home.js 실행 화면 <내용 불러오기> DiaryList.js Home.js App.js 실행 화면 <오래된순, 최신순 정렬> DiaryList.js 실행 화면 <감정 필터> DiaryList.js 실행 화면 <새 일기 쓰기> DiaryList.js 실행 화면 <홈 화면 css> DiaryList.js 실행 화면 <이미지, 글, 버튼> DiaryItem.js DiaryList.js... 개인프로젝트개인프로젝트 데이터 업로드의 시작이었던 disabled disabled를 mdn에서는 이렇게 설명하고 있다. Boolean disabled 속성이 있는 경우 요소를 변경하거나 포커스할 수 없거나 양식과 함께 제출할 수도 없습니다 내가 구성한 코드 구성상 데이터의 name이 반드시 필요하게 구성되어 있다. reducer에서 action을 통해 데이터를 받아 왔을 때 각 사진마다 글을 기록하기 위해서 id값으로 각 배열을 찾게 하지 않고 name을 ... React개인프로젝트React useState를 활용한 유효성 검사 사진의 제목과 사진의 가격이 상태관리를 하는데 반드시 필요한 데이터 였기 때문에 유효성 검사가 필요했으며 유효성 검사 조건이 성립하는 경우에만 등록 버튼이 활성화 되도록 해야 했다. 입력한 결과 값에 따라 상태 변화를 감지하고 데이터값이 유효한지 판별해야 했기 때문에 useState를 사용했다. onChange 이벤트를 활용하였고 그 값이 setName으로 상태를 변경 시키며 조건식을 통하여... React개인프로젝트React 사진 클릭시 메인 사진 바꾸기 useState useState를 활용한 기능 구현 중 처음 시도 했던 기능이 사진 클릭으로 메인 사진 변경 기능 구현이었다. 사실 상태를 관리한다는 점에서 모든 상태 관리를 Redux로 해야하는건가라는 고민이 있었지만. 모든 상태 관리를 Redux를 할 필요 없고 적절하게 적용하기로 하였다 사실 고민을 하였지만 이 기능을 Redux로 구현하는것은 실패하였다. 또한 단지 화면에 보여주는 사진만 변경 하는 것... React개인프로젝트React useNavigate 활용한 에러 해결 사진을 클릭하였을 때 새로운 페이지로 전환하기 위하여 기존에는 를 활용하였다. 목업 데이터로 활용할시에는 서버에서 호출을 받지 않았기 때문에 오류가 발생하지 않았지만 사진을 클릭시 페이지 전환과 동시에 useEffect로 특정 조건인 useParams로 받은 id값이 변경 될시에만 랜더링 되도록 코드를 구성하였지만 랜더링이 되지 않고 계속 오류가 발생하였다. 데이터를 받아오지 못하는 것이었다... 개인프로젝트개인프로젝트 git action으로 heroku deploy 하기 코로나 텔레그램 알람 시스템을 수정하고 배포하는 방식이 현재 git add git commit git push origin master heroku login git push heroku master 이 순서를 진행해야 한다. 오랜만에 배포하느라 heroku 아이디가 뭔지도 가물가물했고, 내가 왜 push 를 github에다가도 하고 heroku 에다 하고 두번이나 하고 있지 라는 생각이 들... 개인프로젝트telegram_coronatelegram_corona AWS API-GATEWAY와 LAMBDA-2 기존 역할 생성이 아니라 기본 Lambda 권한을 가진 새 역할 생성 으로 ‘Hello from Lambda’ 문자열로 리턴되는 Lambda 함수가 생성 인라인 편집기(간단한 코드의 경우 온라인에서 코딩하고 바로 실행) - 외부 라이브러리 사용 불가 zip파일 업로드( 50Mb 이하 외부 라이브러리 이용) zip 파일 업로드로 배포 pip install firebase-admin -t . p... telegram_corona개인프로젝트telegram_corona 1. 혼자 만들어보는 Zara - Q & ORM최적화 Zara에서 를 눌렀을 때 조회되는 리스트에 대한 API입니다. 필터링 부분의 경우 사이즈, 가격, 아이템, 색상에 대해 구현했습니다. 4가지 필터링에 대해서 우선적으로 했습니다. 코트를 눌렀을 때 나오는 대표 상품은 Product에 저장이 되고, 상품에 대한 세부정보는 Query Parameter 필터링 우선, 아래는 Query Parameter로 받아올 변수들입니다. offset, lim... 개인프로젝트개인프로젝트
회원가입 - User 모델 만들기 java에서 object를 만들면 object를 기반으로 테이블 생성 application.yml에서 ddl -> update => data를 insert하고 서버를 재실행 해도 data 유지 -> create => 서버를 재실행 하면 insert한 data 사라짐... 개인프로젝트SpringbootSpringboot React simple diary - 데이터 추가 App.js DiaryEditor.js App.css 실행 화면 App컴포넌트가 DiaryEditor 컴포넌트와 DiaryList 컴포넌트가 함께 사용할 일기 data를 State로 가지고 있는데 일기 data는 빈배열([])로 시작을 하고 일기 상태변화 함수인 setData가 있다 DiaryList 한테는 현재 App컴포넌트가 가진 일기 배열 state의 data를 넘겨주기만 하면 된다 새... 개인프로젝트개인프로젝트 [React + Node.js] 간단한 게시판 만들기 해당 댓글을 등록한 사람만 삭제를 할 수 있습니다. 회원가입 또한 axios 를 이용해 서버와 POST 요청으로 데이터베이스에 해당 계정이 있는지 확인 후 , 가입 여부를 결정했습니다. 물론 배열와 페이지 값은 State에 저장되어있어, 서버에서 값을 가져올 때 쉽게 갱신될 수 있게 했습니다. 우선 리스트에서 각자 부여한 url string 를 이용해 데이터베이스에서 각 페이지에 해당하는 페... Reactnode.js개인프로젝트React React simple diary 프로젝트 3 DiaryList.js App.js DiaryItem.js App.css 실행화면... 개인프로젝트개인프로젝트 React simple diary 프로젝트 2 다른 파일은 이전 진행사항과 동일 DuaryEditor 실행 화면 author에 입력 글자 1글자 이상 content에 입력 글자 5글자 이상이 되어야만 글 등록이 가능하고, 두 조건을 만족 하지 않으면 focus기능을 활용해 입력란이 bold해 지는 효과를 주었음... 개인프로젝트개인프로젝트 React simple diary 프로젝트 DiaryEditor.js 코드 App.js 코드 App.css 코드 실행 화면... 개인프로젝트개인프로젝트 React Emotion Diary - 배포준비 <페이지별로 사이트 이름 바꾸기> <페이지 아이콘 바꾸기> public-favicon으로 변경 가능... 개인프로젝트개인프로젝트 React Emotion Diary - Home <홈> Home.js 실행 화면 <내용 불러오기> DiaryList.js Home.js App.js 실행 화면 <오래된순, 최신순 정렬> DiaryList.js 실행 화면 <감정 필터> DiaryList.js 실행 화면 <새 일기 쓰기> DiaryList.js 실행 화면 <홈 화면 css> DiaryList.js 실행 화면 <이미지, 글, 버튼> DiaryItem.js DiaryList.js... 개인프로젝트개인프로젝트 데이터 업로드의 시작이었던 disabled disabled를 mdn에서는 이렇게 설명하고 있다. Boolean disabled 속성이 있는 경우 요소를 변경하거나 포커스할 수 없거나 양식과 함께 제출할 수도 없습니다 내가 구성한 코드 구성상 데이터의 name이 반드시 필요하게 구성되어 있다. reducer에서 action을 통해 데이터를 받아 왔을 때 각 사진마다 글을 기록하기 위해서 id값으로 각 배열을 찾게 하지 않고 name을 ... React개인프로젝트React useState를 활용한 유효성 검사 사진의 제목과 사진의 가격이 상태관리를 하는데 반드시 필요한 데이터 였기 때문에 유효성 검사가 필요했으며 유효성 검사 조건이 성립하는 경우에만 등록 버튼이 활성화 되도록 해야 했다. 입력한 결과 값에 따라 상태 변화를 감지하고 데이터값이 유효한지 판별해야 했기 때문에 useState를 사용했다. onChange 이벤트를 활용하였고 그 값이 setName으로 상태를 변경 시키며 조건식을 통하여... React개인프로젝트React 사진 클릭시 메인 사진 바꾸기 useState useState를 활용한 기능 구현 중 처음 시도 했던 기능이 사진 클릭으로 메인 사진 변경 기능 구현이었다. 사실 상태를 관리한다는 점에서 모든 상태 관리를 Redux로 해야하는건가라는 고민이 있었지만. 모든 상태 관리를 Redux를 할 필요 없고 적절하게 적용하기로 하였다 사실 고민을 하였지만 이 기능을 Redux로 구현하는것은 실패하였다. 또한 단지 화면에 보여주는 사진만 변경 하는 것... React개인프로젝트React useNavigate 활용한 에러 해결 사진을 클릭하였을 때 새로운 페이지로 전환하기 위하여 기존에는 를 활용하였다. 목업 데이터로 활용할시에는 서버에서 호출을 받지 않았기 때문에 오류가 발생하지 않았지만 사진을 클릭시 페이지 전환과 동시에 useEffect로 특정 조건인 useParams로 받은 id값이 변경 될시에만 랜더링 되도록 코드를 구성하였지만 랜더링이 되지 않고 계속 오류가 발생하였다. 데이터를 받아오지 못하는 것이었다... 개인프로젝트개인프로젝트 git action으로 heroku deploy 하기 코로나 텔레그램 알람 시스템을 수정하고 배포하는 방식이 현재 git add git commit git push origin master heroku login git push heroku master 이 순서를 진행해야 한다. 오랜만에 배포하느라 heroku 아이디가 뭔지도 가물가물했고, 내가 왜 push 를 github에다가도 하고 heroku 에다 하고 두번이나 하고 있지 라는 생각이 들... 개인프로젝트telegram_coronatelegram_corona AWS API-GATEWAY와 LAMBDA-2 기존 역할 생성이 아니라 기본 Lambda 권한을 가진 새 역할 생성 으로 ‘Hello from Lambda’ 문자열로 리턴되는 Lambda 함수가 생성 인라인 편집기(간단한 코드의 경우 온라인에서 코딩하고 바로 실행) - 외부 라이브러리 사용 불가 zip파일 업로드( 50Mb 이하 외부 라이브러리 이용) zip 파일 업로드로 배포 pip install firebase-admin -t . p... telegram_corona개인프로젝트telegram_corona 1. 혼자 만들어보는 Zara - Q & ORM최적화 Zara에서 를 눌렀을 때 조회되는 리스트에 대한 API입니다. 필터링 부분의 경우 사이즈, 가격, 아이템, 색상에 대해 구현했습니다. 4가지 필터링에 대해서 우선적으로 했습니다. 코트를 눌렀을 때 나오는 대표 상품은 Product에 저장이 되고, 상품에 대한 세부정보는 Query Parameter 필터링 우선, 아래는 Query Parameter로 받아올 변수들입니다. offset, lim... 개인프로젝트개인프로젝트