XSS(Cross Site Scripting) XSS 는 사용자가 웹페이지에 임의의 스크립트를 삽입하여 HTML 을 조작하는 방법을 말합니다. 예를 들어, innerHTML 을 사용하는 기능에서 사용자가 이라는 스크립트를 입력하면, script 가 실행되면서 alert 가 동작하는 것을 볼 수 있을 것이다. 이런 식으로 스크립트 코드를 입력했는데 스크립트 코드가 실행됨으로 쉽게 공격을 받을 수 있는 일이 생긴다. XSS 방지 스크립트 태그가 입력되지 않도록 입력값을 막아버리는 방법이 있지만, 입력에 대한 제한의 경우에는 불편함이나 경우의 수가 더 생길 수도 있다. 그렇기 때문에 XSS 를 치환해주는 필터링을 만들어 사용하거나 라이브러리를 참고하여 사용하는게 효과적인 방법이라고 생각한다. 라이브러리를 사용..
OOP (Object-oriented programming) 객체 지향 프로그래밍이라는 뜻으로 흔히들 우리가 알고 있는 자바가 객체 지향 언어이다. 자바스크립트 프레임워크 중 Angular 가 OOP 의 특성을 지니고 있다. (앵귤러의 주력 개발 언어로는 타입스크립트를 사용한다...) 캡슐화 관련 있는 객체, 함수를 그룹화 하는 방식을 말하며, 이를 이용하여 정보은닉을 할 수 있다. 정보은닉이란, 어떠한 정보를 외부에서 볼 수 없도록 보호화 하는 것으로써, 우리가 알고 있는 private 가 있다. 추상화 실제로 존재하는 어떠한 물건의 필요한 정보만을 표현하는 방법으로, 간단한 객체 인터페이스를 만들 수 있고 외부로의 유출, 변경이 되지 않는 장점이 있다. 상속 자식이 부모에게 물려받은 정보를 사용할 수..
mysql 설치 mac 에서 HomeBrew 를 이용하여 mysql 을 설치해보자. brew install mysql설치 후, brew list 를 입력하여 mysql 있는지 확인합니다. mysql 셋팅 및 실행 mysql 셋팅을 위해 서버를 실행시켜줍니다. mysql.server startSuccess! 가 나오면 성공적으로 실행된 것. mysql 설정을 위해 아래 명령어를 입력해줍니다. mysql_secure_installation아래와 같은 순서로 설정작업이 진행됩니다. 1. 비밀번호 복잡성 유무 - Y: 복잡하게, N: 단순하게 2. 비밀번호 설정 - 원하는 비밀번호를 설정해줍니다. 3. 사용자 설정 - Y: -u 사용, N: -u 사용 안함 4. 원격 접속 설정 - Y: 원격 접속 불가능, N:..
HomeBrew mac OS 전용 패키지 매니저 입니다. mac 에 필요한 툴 또는 무언가를 설치할 때 간단하게 설치할 수 있도록 도와줍니다. 아래 url 로 접속하여 가장 처음있는 설치하기 커맨드를 복사하여 터미널에 붙여넣기 해줍니다. https://brew.sh/index_ko 붙여넣기 후, 패스워드를 입력하라고 나온다면 맥북의 비밀번호를 입력해주시고 return 을 해주시면 됩니다. 오류 발생 M1 칩이 있는 맥북에서 다운로드시 다음과 같은 경고문이 나오는 것을 볼 수 있습니다. (/opt/homebrew/bin is not in your PATH) 그런 경우에는 커맨드에서 오류에 대한 정보를 공유해 줄 것입니다. Next Steps: => 로 해서 아래와 같이 나오는 것을 복사해서 실행시켜주면 됩..
성능 탭 화면단의 개발을 하다보면, 페이지의 동작이 어떠한 순서를 가지고 있는지, 성능이 얼마나 나오는지 확인하고 싶은 경우가 생긴다. 그럴 때는 개발자 도구의 성능 탭을 사용을 하면 되는데, 성능 탭은 자동으로 페이지를 분석하는 것이 아닌, 기록 버튼을 눌러 해당 페이지의 동작을 녹화 한 뒤, 녹화된 내용을 토대로 분석한 기록들이 나오게 됩니다. F12 를 눌러 개발자 도구를 열고 성능 탭을 누르면, 아래와 같은 화면을 볼 수 있을 것 입니다. 왼쪽 위의 녹화 표시로 되어있는 것을 누르면 페이지의 녹화가 시작되고 거기서 일어난 동작들을 분석(플로우, 렌더링 속도)합니다. 우리가 자주 쓰는 네이버 페이지에서 한 번 해보자. 녹화를 끝내면 아래와 같이 네트워크, 프레임, 기본 등등 해서 분석된 내용이 나오..
PowerMode Combo 기능 끄기 VSCode 에서 정말 애용하고 있는 PowerMode 에는 기본적으로 콤보 기능을 제공하고 있지만, 개인적으로 화면상에 정신없고 눈이 아픔으로 해당 기능을 끄는 방법을 제공합니다. File > Preferences > Settings 로 들어가서 PowerMode 를 검색합니다. 다음 이미지의 해당 구간(Counter 와 Timer)을 default 또는 show 로 되어있는 경우, hide 로 변경하면 됩니다.
- Total
- Today
- Yesterday
- 네이버 서치 어드바이저
- 오블완
- Github Actions
- Git
- AWS
- Embedding
- NextJS
- seo
- 티스토리챌린지
- vue router
- svelte
- 서버 to 서버
- openAI
- docker
- dockerfile
- React
- 타입스크립트
- Storybook
- nodejs
- vscode
- cors
- Vite
- vue composition api
- nuxt2
- 스벨트
- webpack
- 깃허브
- NUXT
- nextjs14
- nextjs13
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | 5 | 6 | 7 |
8 | 9 | 10 | 11 | 12 | 13 | 14 |
15 | 16 | 17 | 18 | 19 | 20 | 21 |
22 | 23 | 24 | 25 | 26 | 27 | 28 |
29 | 30 | 31 |