JavaScript 시큐어코딩 가이드

https://www.kisa.or.kr/2060204/form?postSeq=14&page=1#fnPostAttachDownload KISA 한국인터넷진흥원 www.kisa.or.kr

• format_list_bulleted 기타/메모
• · 2025. 3. 18.
• textsms

SQL injection 대비하여 코드 짜기 : 로그인

select *from table_namewhere 1=1 and user_id = 'id' and user_pw = 'pw' 보통 이런식으로 로그인을 짜게되면 SQL Injection의 위험이 있다 예를들어 로그인을 할 때 1=1 --을 넣게되면select *from table_namewhere 1=1 and user_id = 'id' or 1=1 -- and user_pw = 'pw'그냥 로그인이 되어버린다  그래서 아예 id만 가지고 데이터를 아래와 같이 가져온 뒤select *from table_namewhere 1=1 and user_id ='id'  컨트롤러에서 pw를 검증했다.HashMap retMap = new HashMap();HashMap u..

• format_list_bulleted Java
• · 2025. 3. 18.
• textsms

[React.js] 실습 준비하기

1.  새로운 리액트 앱 생성npm create vite@latestsection05react 선택javescript 선택   2. 폴더열기파일 - 폴더열기 - 금방 만든 section05파일 열기  3. dependencies 다운로드npm install  4. 리액트 실행npm run dev 5. 불필요한 파일 삭제  1. /src/App.jsx에서 상단 svg 파일 사용 하지 않기 때문에 파일, impor문 모두 삭제하나는 퍼블릭, 하나는 에셋 폴더에 들어가 있다. 2. useState 삭제 import { useState } from 'react'const [count, setCount] = useState(0)  3. App()을 리턴하고 있는 Div 모두 삭제 후 리턴문 수정div> a hre..

• format_list_bulleted React/한입크기로 잘라먹는 리액트
• · 2025. 2. 26.
• textsms

[React.js] 리액트의 구동 원리

1. localhost:5173 으로 접속 할 수 있었던 이유- 리액트 앱에 웹서버가 내장 되어 있어 npm run dev는 리액트 서버 가동 명령어이기 때문- 포트번호 : 하나의 컴퓨터에서 여러 대의 서버를 동작시키기 위해 필요한 주소  → 프로그램이 실행 될 때마다 컴퓨터가 자동으로 고유한 포트번호를 지정해 줌  2. 화면에 요소를 랜더링 하는 원리- 우리가 localhost:5173 으로 접속을 하면 리액트는 index.html 파일을 브라우저에 보여준다.  index.html  main.jsxcreateRoot(document.getElementById('root')).render( ,) index.html 에 연결 된 스크립트파일 main.jsx에서 root라는 ..

• format_list_bulleted React/한입크기로 잘라먹는 리액트
• · 2025. 2. 20.
• textsms

[React.js] React App 생성하기

1. 터미널 열어서 vite 다운 npm create vite@latest 2. 라이브러리 설치하기pakage.json 의 dependencies와 devDependencies 을 기반으로 라이브러리를 별도 설치 해 줘야 함터미널 열기 : 커멘드 + jnpm install혹은npm i  혹시 위와 같은 에러가 난다면 현재 위치를 잘 확인하자 cd 로 selection04 경로로 들어가서 npm install을 해줘야한다 3.  설치 파일의 용도 1. public 폴더이미지 파일, 폰트, 영상 같은 파일들을 저장하는 곳 2. src 폴더실제로 작성하게 될 코드를 보관하는 곳 2-1 src - assets - .jsx리액트 코드가 작성 되는 곳 2-3 src - assets - React.svg이미지, 폴더..

• format_list_bulleted React/한입크기로 잘라먹는 리액트
• · 2025. 2. 19.
• textsms

[React.js] React.js란

1. 컴포넌트를 기반으로 UI를 표현- 중복코드 제거의 장점이 있음.- 유지보수 용이 2. 화면 업데이트 구현이 쉬움- 선언형 프로그래밍 방식 (목적만 간결히 명시하는 방법)- 컴포넌트의 State 변수의 값에 따라 랜더링 결과가 달라지기 때문에 업데이트 구현이 쉬움  3. 화면 업데이트가 빠르게 처리 됨- DOM을 한번에 모아서 처리

• format_list_bulleted React/한입크기로 잘라먹는 리액트
• · 2025. 1. 22.
• textsms