반응형 프로젝트21 [배포] Render.com 배포하기 (Node.js, React, mongoDB) 배포 준비1. server.js 2. package.json 3. cmdD:\Workspace\CHAT-APP>npm run build 4. dist 폴더 생성 완료 5. npm startD:\Workspace\CHAT-APP>npm start 6. git commit수정한 파일들을 깃허브에 업로드하기. Render.com 배포하기 1. Web Service 생성하기 2. 필수 내용들 써주기 3. 성공하면 live 단점Render.com은 무료로 사용할 수 있어서 좋지만, 15분동안 트래픽이 없으면 서버 연결이 끊어진다.다시 연결하려면 수동으로 해줘야한다.이 부분을 개선하기 위해 스케줄을 지정해놓고 서버에 연결해주는 cron jobs 사이트를 이용할 것. 2024. 6. 7. [Node.js] 채팅 앱 만들기 (backend) 채팅 앱 만들어보자!Node.jsVite + ReactMongoDBreact 설치터미널 frontend 폴더에서 설치하기npm create vite@latest .React / JavaScript 선택패키지 설치루트 폴더에서 npm init -y 실행npm i express dotenv cookie-parser bcryptjs mongoose socket.io jsonwebtoken 전부 설치 : express, dotenv, cookie-parser, bcryptjs, mongoose, socket.io, jsonwebtokennodemon 설치npm install nodemon --save-dev -g Nodemon은 Node.js 애플리케이션 개발을 보다 편리하게 해주는 도구로, 소스 코드가 변경될.. 2024. 6. 5. [Spring boot] 취업정보 크롤링 정제 작업 접수 기간 기준으로 정렬하기백엔드 서비스 클래스에서 정렬하는 코드 추가하기. private List filterAndCleanJobs(List jobs) { // 중복 제거 (detailLink 기준) Map uniqueJobs = new HashMap(); for (JoblistsDTO job : jobs) { uniqueJobs.put(job.getDetailLink(), job); } // 필드 형식 통일 및 빈 데이터 제거 List filteredJobs = uniqueJobs.values().stream() .filter(this::isValidJob) .. 2024. 5. 31. [Spring] 글쓰기 제한하기 관리자만 글 등록 가능하게 하기 FaqQuestion.vue관리자만 글 작성 가능하도록 수정함. 번호 제목 글쓴이 날짜 {{ index + 1 + (currentPage * pageSize) }} {{ question.title }} {{ question.writer }} {{ question.date }} Page {{ currentPage + 1 }} Page {{ curre.. 2024. 5. 27. [Spring boot, Vue3] 사이트 크롤링 하기 채용공고 크롤링가져올 URL : https://job.incruit.com/jobdb_list/searchjob.asp?occ2=574&occ1=120&rgn2=11 build.gradle에 jsoup 추가하기implementation 'org.jsoup:jsoup:1.14.3'CrawlingPage.vue 취업 리스트 크롤링 채용 제목 기관 고용 형태 근무 지역 접수 기간 .. 2024. 5. 27. 0525 프로젝트 트러블슈팅 게시판 정렬 및 출력 JPA 방언 설정spring.jpa.properties.hibernate.dialect=org.hibernate.dialect.MariaDB106Dialectspring.jpa.hibernate.ddl-auto=updatespring.jpa.properties.hibernate.format_sql=truespring.jpa.properties.hibernate.show_sql=true faq 게시판 crud 수정, css, 게시판 역순정렬questionId가 undefined로 전달되는 문제 : fetchQuestions() { axios.get(`http://localhost:3000/api/faqquestions/paged?page=${this.currentPage}&size=${th.. 2024. 5. 27. 마이페이지에 DB값 불러와서 출력하기 마이페이지 심리검사 결과문제는 Vue.js 코드에서 axios 요청을 보낼 때, 반환되는 데이터 형식과 Vue.js 코드에서 사용하는 데이터 형식이 일치하지 않기 때문입니다. 백엔드에서 반환되는 데이터는 TestResult 객체 하나이지만, Vue.js 코드에서는 testResult를 배열로 처리하고 있습니다. 정말 자주 겪었던 데이터 형식 문제. 테스트 결과 테스트 번호: {{ testResult.tno }} SID: {{ testResult.sid }} QID: {{ testResult.qid }} 답변: {{ testResult.tanswer }} 총 점수: {{ t.. 2024. 5. 20. DB에 있는 List값을 불러오지 못하는 경우 문제계속 List 값을 불러오지 못하는 에러가 있었음.MySimriController@RestControllerpublic class MySimriController { @Autowired private TestResultRepository testResultRepository; @Autowired private JwtService jwtService; @GetMapping("/api/mysimri") public ResponseEntity getTestResultsForQid( @CookieValue(value = "token", required = false) String token ) { System.out.println("심리결과 토.. 2024. 5. 20. 기존 DB 테이블에 id 저장하기 (토큰으로 받아오기) DB에 id 저장memberId 받아와서 db에 저장하기token으로 받아와야 함. @PostMapping("/submitTest") public ResponseEntity submitTest(@RequestBody ResultData resultData, @CookieValue(value = "token", required = false) String token) { System.out.println(resultData + "토큰 submit test");TestResult (entity)해당 테이블에 memberId 컬럼을 만들어줌 @Column(name = "member_id") @Comment("회원 ID") private int mem.. 2024. 5. 20. 심리검사 총점 받아오기 클라이언트 vue 코드 submitTest() { console.log(this.userAnswers); console.log('네비게이션 전에 로그 출력'); const isAllAnswered = Object.keys(this.userAnswers).length === this.questions.length; if (!isAllAnswered) { alert("모든 질문에 답해주세요."); return; // 모든 질문에 답하지 않았다면 여기서 함수 종료 } // 총점 계산을 위해 각 질문의 답변을 배열에 담기 const userAnswersArray = this.questions.map(question =>.. 2024. 5. 17. 이전 1 2 3 다음 반응형
