본문 바로가기

전체 글

(128)
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 : 화면..
webgoat CIA Triad CIA의 3요소(기밀성, 무결성, 가용성)에 대한 이야기입니다. 이 파트는 따로 실습이 있는 건 아니고 뒤에 있는 설명을 보고 문제를 푸는 것입니다. 중간고사 오픈북 테스트 보는 느낌이네요. 기밀성은 승인되지 않은 누군가에게 공개되지 않도록 하는 것입니다.무결성은 데이터의 일관성, 정확성 및 신뢰성을 유지하는 것입니다.가용성은 인증된 사람이 요청 시 액세스하고 사용할 수 있는 것입니다. 각 문제들의 정답들만 한번 살펴보겠습니다. 기밀성에 대한 이야기로 해커가 데이터베이스의 정보를 온라인에 올림으로서 훼손될 수 있습니다. 무결성에 대한 이야기로 데이터베이스의 정보를 바꿈으로서 훼손될 수 있습니다. 가용성에 대한 이야기로 서버에 서비스 거부 공격을 해서 훼손할 수 있니다. CIA 3요소 중 하나라도 훼손된다..