본문 바로가기

분류 전체보기178

웹 개발 - 프로젝트 2 - 10. 회원가입 이제 서비스에서 회원가입하는 부분을 만들 것입니다. 이때 평문으로 받으면 큰일이 날 수 있기 때문에 암호화를 할 것입니다.controller컨트롤러에서는 아이디와 패스워드를 입력받습니다. 그리고 컨트롤러에서는 getName을 이용해서 해당 유저가 있는지 확인합니다. 만약 유저가 있으면 무시하고 없으면 service에서 계정 등록을 합니다. 그리고 service에서는 userRegisterRequest에서 값을 가져와서 입력을 합니다. 이때, 비밀번호를 그해로 저장하면 DB가 탕취되었을 때 큰일이 날 수 있으니 암호화를 해서 저장합니다.암호화util 패키지를 만들고 여기에 유용한 기능들을 넣습니다. 비밀번호를 해시를 해서 저장을 합니다. 그리고 유저자 로그인을 할 때 입력한 패스워드를 동일한 해시를 적용해.. 2024. 10. 13.
react - useContext react로 웹을 만들다 보면 전역변수를 가져와야 할 때가 있습니다. 이때 Context를 이용해서 해결할 수 있습니다.로그인 상태를 저장하는 전역변수를 만든다고 해봅시다.createContext를 이용해서 context를 만듭니다. 를 이용하면 이 안에서는 해당 context 값을 읽고 쓸 수 있습니다.useContext를 이용해서 값을 읽을 수 있습니다. 같은 파일에 useAuth 함수를 만들어서 값을 export 합니다. 이 함수를 호출해서 값을 읽을 것입니다. 값을 읽고싶은 파일에서 useAuth를 호출해 isLogin과 setIsLogin을 받습니다. 그럼 isLogin과 setIsLogin을 사용할 수 있습니다. 2024. 10. 12.
webgoat 강의 만들기 이거는 해킹과는 관련이 거의 없습니다. 굳이 따지자면 코드 읽는 법을 고즘 연습할 수 있겠네요.이 강의 는 webgoat에서 강의를 만드는 방법에 대해 설명합니다.webgoat 강의webgoat에서는 spring boot를 이용해서 강의를 만듭니다. 다른 것은 조금 치워두고 completed를 봅시다. 두번째 문단에 secretValue.equals(param1) 조건문이 있습니다. 그리고 success를 리턴합니다. 이것이 일치하면 답이라고 판단하나 봅니다. webgoat 자체를 해킹하는 느낌이 들어서 좋네요.아래에 보면 html이 있습니다. webgoat의 프론트에 해당하는 부분 같습니다. 여기에 아까 봤던 param1가 있습니다. secretValue가 secr37Value입니다. 그리고 param.. 2024. 10. 11.
react - useEffect react를 하다 보면 화면이 처음 보여질 때나 특정 값이 바뀔 때 실행했으면 하는 경우가 있습니다. 이런 경우 useEffect로 해결할 수 있습니다.관리자 페이지가 있다고 해봅시다. 이 페이지가 처음 보여질 때 관리자가 맞는지 체크할 것입니다. useEffect() 안에 함수를 넣어서 어떤 것을 실행할 지 정할 수 있습니다. 마지막에 []를 넣으면 처음 화면에 보여질 때만 실행합니다. 이 코드는 todo list의 일부입니다. api를 호출해서 해야할 일의 목록을 가져오고 있습니다. 그러면 이런 에러가 여러분을 반겨줍니다. 이것은 useEffect에서 async를 사용했을 때 나타나는 현상입니다. 이 경우 아래와 같은 꼼수를 쓸 수 있습니다. 만약 일의 목록이 갱신될 때 마다 일의 개수를 출력해주려면.. 2024. 10. 9.
react - useState react로 개발을 하다 보면 값이 바로 반영이 안 된다는 것을 느낄 때가 있습니다. 이 코드 같은 경우 버튼을 누르면 x값이 올라가도록 하는 프로그램입니다. 하지만 버튼을 누르면 x가 바뀌긴 하지만 화면에는 반영되지 않습니다.react의 경우 렌더링을 통해서 화면의 정보를 갱신해 줍니다. 하지만 변수가 바뀔 때마다 랜더링을 하면 불필요한 갱신이 발생할 수 있습니다.이런 경우 useState를 이용해서 해결할 수 있습니다. 이렇게 하면 setX를 호출할 때 마다 화면을 새로 랜더링해 줄 수 있습니다.뭔가 이상합니다. setX를 통해 x를 증가해 줬는데 console.log에는 증가하기 전의 값이 보이고 있습니다.이것은 비동기 때문에 그렇습니다. useState의 상태는 비동기적으로 업데이트됩니다. plu.. 2024. 10. 8.
23755 - 카드컨트롤 (Hard) step 1더보기위에서부터 셌을 때 준석이는 홀수번째 카드, 수현이는 짝수번째 카드를 가져갑니다. 홀수번째에 있는 O의 개수가 더 많으면 준석이가 이깁니다.만약 처음부터 준석이가 이긴다면 답은 0입니다.만약 처음부터 수현이가 이긴다면 답은 1입니다. 제일 밑 카드를 위로 올리면 홀짝이 바뀌면서 승패도 바뀌게 됩니다.무승부일때(홀수 번째의 O와 짝수 번째의 O의 개수가 같은 경우)만 처리를 하면 됩니다.step 2더보기위에서부터 2개씩 짝을 지어 봅시다. 그럼 OO, OX, XO, XX 4종류가 나옵니다. OX는 준석이가 이기는 경우, XO는 수현이가 이기는 경우입니다.홀수 번째의 O와 짝수 번째의 O의 개수가 같기 때문에 OX의 개수와 XO의 개수가 같습니다.만약 XO가 하나라도 있는 경우 X를 먼저 올.. 2024. 10. 7.

티스토리툴바