웹 프로그래밍

웹 프로그래밍

[Spring Boot] Licruit - 단방향 관계 매핑, 토큰 재발급

회원 - 업종 단방향 관계 매핑auto incresemental id 컬럼을 추가했다. 사업자번호를 기본키로 쓰는 것보다 이게 왜 나은 지는 아직도 납득 못하겠지만 보통 이렇게 한다고 하니까 고쳤다.사용자를 조회할 때는 업종을 조회하는 경우가 있지만 업종을 조회할 때는 사용자를 조회하는 경우가 없다. 따라서 단방향 매핑만 해도 된다고 생각한다. // ...public class UserEntity { @Id @GeneratedValue(strategy = GenerationType.IDENTITY) @Column(name = "id") private int userId; @Column(name = "company_number", unique = true, length = 10)..

웹 프로그래밍

[Spring Boot] Licruit - 로그인

JWTbuild.gradle버전 안 적어도 된다고 분명 누가 그랬었는데.... 안 적으니까 에러가 나서 적어줬다.dependencies { // ... implementation 'io.jsonwebtoken:jjwt-api:0.11.5' implementation 'io.jsonwebtoken:jjwt-impl:0.11.5' implementation 'io.jsonwebtoken:jjwt-jackson:0.11.5'} application.propertiesjwt 관련 환경변수 정의하기#jwtspring.jwt.accessTokenExpireTime=3600000spring.jwt.refreshTokenExpireTime=1296000000spring.jwt.secret=bGljcnVpdC1iYWNr..

웹 프로그래밍

[Spring Boot] Licruit - 에러 처리

ResponseSuccessResponseexpress에서 end()와 같은 것이라고 생각하고 있다. 파라미터로 String message를 받으면 모든 Success 응답에서 메시지를 적어줘야 하는데 그래야 할 이유가 없는 것 같아서 파라미터를 받지 않기로 했다.public record SuccessResponse() { } UserController회원가입이 정상적으로 이루어졌으면 201을 반환한다. body는 {} 이렇게 응답을 보낸다.@RestController@RequestMapping("/users")@RequiredArgsConstructorpublic class UserController { private final UserService userService; @PostMappi..

웹 프로그래밍

[Spring Boot] Licruit - 회원가입(2)

비밀번호 암호화build.gradle비밀번호 암호화와 cors, csrf 설정 등을 위한 의존성을 추가한다.dependencies { // ... implementation 'org.springframework.boot:spring-boot-starter-security'} SecurityConfigconfig 패키지 안에 SecurityConfig 클래스를 작성한다.securityFilterChain 메서드에서 cors, csrf, 인증 검사를 제외할 라우트를 작성한다.비밀번호를 암호화하는 메서드 passwordEncoder를 작성한다.@Configuration@EnableWebSecurity@RequiredArgsConstructorpublic class SecurityConfig { @Bean..

웹 프로그래밍

[Spring Boot] Licruit - 회원가입

의존성 추가build.gradle 파일에 DB 연결과 유효성 검사를 위해 아래 4개의 의존성을 추가했다.dependencies { implementation 'org.springframework.boot:spring-boot-starter-web' implementation 'org.springframework.boot:spring-boot-starter-web-services' compileOnly 'org.projectlombok:lombok' annotationProcessor 'org.projectlombok:lombok' testImplementation 'org.springframework.boot:spring-boot-starter-test' testRuntimeOnly 'org.junit...

웹 프로그래밍

[Spring Boot] API 생성

https://velog.io/@hyeok_1212/GDSC-Spring-Boot%EB%A1%9C-REST-API-%EB%A7%8C%EB%93%A4%EC%96%B4%EB%B3%B4%EA%B8%B0 [GDSC] Spring Boot로 REST API 만들어보기GDSC 서버 파트의 스터디를 위한 자료velog.io위 글을 참고해서 작성했다.  프로젝트 생성Group에는 회사 도메인 이름을 역순으로 작성한다.다 작성했으면 Next를 누른다.Lombok, Spring Web, Spring Web Services를 체크하고 Create를 누른다. 프로젝트 이름을 test로 했기 때문에 TestApplication이 생긴 것을 확인할 수 있다.위 사진과 폴더 구조가 동일해지도록 com.example.test 우클릭..

웹 프로그래밍

[React] 프로젝트 관리 앱

App.jsx import { useState } from "react"; import { v4 as uuid } from "uuid"; import Sidebar from "./components/Sidebar"; import NoSelected from "./components/NoSelected"; import AddProject from "./components/AddProject"; import ProjectDetail from "./components/ProjectDetail"; function App() { const [selected, setSelected] = useState({ selected: "none", project: {} }); const [projects, setProject..

웹 프로그래밍

[React] Investment Calculator

App.jsx import { useState } from "react"; import Header from "./components/Header"; import UserInput from "./components/UserInput"; import ResultTable from "./components/ResultTable"; const initInput = { initialInvestment: 10000, annualInvestment: 300, expectedReturn: 5, duration: 1 } function App() { const [input, setInput] = useState(initInput); const handleChange = (evt, type) => { setInput((..

웹 프로그래밍

[YelpCamp 프로젝트] 보안

SQL Injection 이름은 SQL Injection이지만 No SQL도 해당되는 이야기다. SQL Injection이란 사용자 input으로 데이터베이스 쿼리를 만들때 input에 SQL 구문을 작성하여 작성된 SQL 구문이 실제로 동작하게 되는 것을 말한다. express와 mongo 환경에서 이것을 막아보자. npm i express-mongo-sanitize 위 패키지를 설치하고 아래 코드 처럼 미들웨어를 추가하면 된다. const mongoSanitize = require('express-mongo-sanitize'); app.use(mongoSanitize()); Cross Site Scripting (XSS) XSS는 클라이언트 측 스크립트가 웹 페이지에 삽입되는 것을 말한다. 아래의 예..

웹 프로그래밍

[Yelpcamp 프로젝트] 디자인 수정

지도 축소/확대 버튼 추가 index 페이지와 show 페이지에 있는 지도에 축소/확대 버튼을 추가해 보자. 아래 페이지를 참고했다. https://docs.mapbox.com/mapbox-gl-js/example/navigation/ Display zoom and rotation controls | Mapbox GL JS Add zoom and rotation controls to the map. docs.mapbox.com index와 show페이지에 연결된 각각의 js 파일에 아래 코드를 추가해주면 된다. map.addControl(new mapboxgl.NavigationControl()); Home 디자인 정말 못생긴 Home 페이지 입니다. 그럴싸하게 수정해 봅시다. html YelpCamp ..

미안하다 강림이 좀 늦었다
'웹 프로그래밍' 카테고리의 글 목록