본문 바로가기

개발

(35)
spring boot - 환경 변수 작업을 하다 보면 코드나 깃에 들어가면 안되는 변수들(ex. 비밀번호)이 있습니다. 이런 변수들을 잘 관리하기 위해 환경변수를 만듭니다.환경변수 세팅저는 config를 관리하는 패키지에 PropertyConfig파일을 만들었습니다. @Configuration: 세팅 파일임을 선언합니다.@PropertySource("classpath:static/properties/env.properties"): 어떤 파일을 환경변수로 사용할 것인지 정의합니다.지정한 파일에 환경변수 파일을 넣습니다. .gitignore에 해당 파일을 꼭 넣어줍니다. 이것을 빠트리면 모든 비밀번호가 공개됩니다. 만약 gitignore이 동작하지 않는다면git rm -r --cached . 로 캐시를 지우고 다시 진행하 됩니다.사용법저는 s..
react - 소스 코드로 페이지 전환 헤더의 우측 상단에 로그인 탭이 있는 경우가 있습니다. 해당 탭을 누르면 로그인 창으로 이동합니다. 해당 기능을 구현해 봅시다.Nav  디자인우선 nav탭을 디자인해 봅시다. Navbar.Text : nav창의 우측 상단에 보여줍니다. text라고 되어 있지만 안에 넣은게 버튼이여도 됩니다.Button : 예쁜 버튼입니다. 그냥 버튼이 아니라 예쁜 버튼입니다.onClick={move} : 클릭 시 move함수를 호출합니다.variant="primary" : 예쁜 파란 버튼을 보여줍니다. 이렇게 하면 화면이 큰 상태에서는 이렇게 보이고 줄어들면  이렇게 보입니다. 오른쪽 위 버튼을 누르면 창이 열리면서 버튼도 함께 보입니다.탭 이동탭은 useNavigate를 이용해서 이동할 수 있습니다. onClick을 ..
spring boot - 메일 전송 이메일 인증을 통해서 회원 가입을 하는 경우 서버에서 메일을 보낼 수 있어야 합니다. 계정 설정구글 계정 - 보안으로 이동합니다. 그리고 2단계 인증을 해줍니다. 이제 앱 비밀번호를 설정해 주겠습니다. 앱 비밀번호로 가면 아래와 같이 나옵니다.  그럼 16개의 알파벳이 나옵니다. 구글은 이걸 따로 적어두지 않아도 된다고 하지만 이거 나중에 써야 하므로 적어둡니다. 이제 메일을 설정할 것입니다. gmail - 설정으로 갑니다. 전달 및 POP/IMAP로 가서 둘 다 사용으로 체크해 줍니다. 서버이제 서버 설정을 합니다. build.gradle에 다음 의존성을 넣어줍다. implementation 'org.springframework.boot:spring-boot-starter-mail' : 이메일을 보내기..
[논문 리뷰] NEfficientNet: Rethinking Model Scaling for Convolutional Neural Networks (EfficientNet) ConvNet을 사용하는 네트워크들은 네트워크의 폭, 깊이, 해상도를 잘 바꾸면 모델의 성능이 향상된다고 합니다. 그럼 가장 성능이 좋은 값을 인공지능이 찾도록 하면 되지 않을까요? 이 논문은 여러 파라미터들을 잘 찾아주는 인공지능에 대한 것입니다.  접근법우선 문제에 대한 정의를 해 봅시다. i번째 Conv레이어는 다음과 같이 정의됩니다. $Y_i=F_i(X_i)$ $Y_i$는 출력 텐서, $F_i$는 연산, $X_i$는 입력 텐서입니다.입력 텐서는 (H_i, W_i, C_i)로 표현되는데 $H_i$는 너비, $W_i$는 높이, $C_i$는 채널 수입니다. ConvNet $N$은 $F_k\odot F_{k-1}\odot... F_1(X_1) = \bigodot_{j=1... k} F_j(X_1)$로 표..
react - 페이지 전환 페이지가 하나만 있는 홈페이지는 거의 없습니다. router를 이용해 여러 페이지를 컨트롤 해 봅시다.npm i react-router-dom 를 이용해 router를 하게 해주는 패키지를 설치합니다. index.js로 가서 App를 BrowserRouter로 감싸줍니다. 이제 페이지를 2개 만듭니다. 저는 login과 streak 페이지 2개를 만들었습니다. app.js에서 Routes와 Route를 추가해 줍니다. path에 경로를 넣어주고 element에는 컴포넌트를 넣어주면 됩니다. 이제 url에 /login을 하면 login에서 만든 페이지나 나옵니다.
react - 헤더, 페이지 만들기 헤더웹 페이지에 있는 헤더를 만들어 주겠습니다. components - header 페이지를 만들고 header.jsx를 만들어 줍니다. ~~.jsx와 ~~.module.scss는 세트라고 생각하면 됩니다. react bootstrap을 설치하고(https://codestudycafe.tistory.com/87) 위와 같이 작성합니다. react bootstrap 공식 페이지(https://react-bootstrap.netlify.app/docs/components/navbar)에 잘 설명되어 있지만 옵션이 많으니 몇 개만 이야기해 보겠습니다. expand="lg" : 크기가 줄어들면 navbar의 모양이 바뀝니다. 언제 모양이 바뀔지 설정해 줍니다. lg는 992px입니다. Container : 화면..
spring boot - db 조회 백엔드한테 정보를 달라고 했으면 db에에 해당하는 값을 가져와야 합니다. JPA를 통해 값을 가져와 봅시다.db 폴더 안에 UserRepository interface를 만듭니다. 여기에 JpaRepository를 상속받습니다. UserEntity 형식이고 primary key 타입이 long입니다. JpaRepository에 가보면 기본적으로 있는 것들이 있습니다. 이것들을 이용해 편하게 쿼리를 쓸 수 있고 직접 만들수도 있습니다. 저는 name과 password가 일치하는 레코드가 있는지 찾아야 합니다. Jpa에 findFirstByNameAndPassword 함수를 넣어줍니다. name과 password가 일치하는 것 중 하나를 찾아줍니다. 없을수도 있으니 optional을 넣어줍니다.이제 Cont..
spring boot - filter 실제 서비스를 운영하다 보면 요청에 따라 요청과 응답을 확인하고 싶을 때가 있습니다. 이때 저희는 Filter를 사용할 수 있습니다. filter 패키지 하나 만들고 여기에 Log를 출력해 주는 LoggerFilter 클래스를 하나 만듭니다. 해당 클래스는 Component annotation을 붙여서 bean에 등록해 줍니다. @Component는 앱이 시작하는 동안 어플리케이션 컨텍스트에 추가해 주는 것인데 일단은 그냥 써줍시다. 빨간 줄에 커서를 대고 alt + enter, implement method, doFilter를 추가해 줍니다. servletRequest를 HttpServletRequest로 형변환해 주고 이를 ContentCachingRequestWrapper객체로 만들어 줍니다. re..
[논문 리뷰] Neural Architecture Search: A Survey(NAS) Neural Architecture Search(NAS)는 인공지능을 만들어 주는 인공지능입니다. 보통 인공지능을 만들 때 모델을 만드는데 이 모델을 인공지능을 이용해서 만들어 보자는 것입니다. 이 인공지능의 컨셉과 발전 과정 집중해서 이야기해 보겠습니다.기본 전략3가지 개념을 알아야 합니다. search space : dense net, convolution, skip connection 등 여러 레이어가 있습니다.search strategy : search space를 어떻게 탐색할지 정합니다.performance estimation strategy : 찾은 아키텍쳐가 얼마나 성능을 내는지 구합니다. 직접 트레이닝해도 되고 퍼포먼스를 예측하는 알고리즘을 도입할 수 있습니다. search strateg..
spring boot - post 전송(with data) 유저가 로그인을 한다고 가정해 봅시다. 그럼 아이디와 비번을 서버에 보낼 것입니다. 먼저 사람들이 입력을 하는 형식을 만들어 봅시다. user 밑에 model 패키지를 만들고 UserLoginRequest를 만듭니다. 이제 UserLoginRequest에 어떤 식으로 입력해야 하는지 적을 것입니다. 이름과 비번을 입력받는데 빈칸이면 안되니까 NotBlank annotation을 넣어줍니다.만약 NotBlank에서 에러가 발생하면 build.gradle에 마지막 문구를 추가해 줍니다.controllercontroller 패키지에는 아래와 같이 만듭니다. http://localhost:8080/open-api/user/login에 UserLoginRequest 형식으로 호출한다는 뜻입니다. 이걸로 로그인을 ..