만족

SQL Injection이란? SQL 주입(삽입)이라고도 부르며, 개발자의 의도대로 동작하지 않는 구문을 추가하여 피해를 입히는 공격 방식이다. SQL Injection 예시 const removeAccount= (accountId)=>{ database.executeQuery(`DELETE FROM Account WHERE id='${accountId}'`); }; 다음과 같은 코드가 있다고 해 보자. 유저가 정상적인 id를 입력할 때는 상관 없지만, 공격자가 accountId 값에 1' OR 1=1; -- 를 입력하게 되면 쿼리문은 다음과 같이 변한다. DELETE FROM Account WHERE id='1' OR 1=1; 따라서 모든 계정이 삭제되는 결과가 초래된다. 이런 식으로 데이터를 몽땅 날..

www.w3schools.com/php/phptryit.asp?filename=tryphp_compiler 실행 결과가 궁금하지만 내 프로젝트에 추가하긴 싫을 때 쓰면 유용하다. 속도는 기대하지 말 것...

위와 같은 구조로 라우팅을 구성했다면, 가령 /test 같은 주소는 존재하지 않으므로 텅 빈 화면만이 표시된다. 이를 시각화해주는 것이 UX관점에서 좋기 때문에 추가해야 한다. 먼저 로 라우트 컴포넌트들을 감싸준다. Switch컴포넌트 내부에서는 반드시 하나의 Route컴포넌트만이 렌더링 된다. 가령 apple}/> banana}/> 이런 구조로 되어 있다면 apple 만이 렌더링된다. 그리고 를 추가한다. (NotFound 위치에는 렌더링할 컴포넌트를 넣어주면 된다.) 위의 Route패턴과 일치하는 path를 찾지 못했을 경우에 NotFound가 렌더링 된다. 잘 작동한다.

애플워치를 사서 줄질을 해보려고 했으나... 스트랩이 너무 비싸서 엄두를 못 내고 있었다. 솔직히 에르메스같은 거야 비싼거 이해라도 하겠는데 얘는 그냥 실리콘 뚝딱 찍어내놓고 육만원을 달라니 아니꼬와서라도 사기가 싫다. 그래서 타사에서 제조한 애플워치 스트랩을 구매하기로 했다. 일단 가격은 매우 싸다. 리뷰를 둘러봐도 호평이 자자해서 두개 샀다. 메탈스트랩 하나, 실리콘스트랩 하나 해서 15000원정도에 구매했다. 맨 끝에 있는 검정 실리콘 스트랩이 정품이고, 나머지는 타사 제품이다. 차이점 메탈 스트랩은 정품이 없으니, 넘어가고 실리콘의 경우, 타사 제품은 실리콘이 더 뻣뻣하다. 그래서 시계를 찰 때 가끔 삑사리가 나서 짜증난다. 또, 먼지가 더 잘 달라붙는것 같다. 차고 나면 뭐... 크게 싼티가 난..

blog.hyungsub.com/entry/%EB%AA%A8%EB%8B%88%ED%84%B0-%EC%BB%AC%EB%9F%AC-%EC%BA%98%EB%A6%AC%EB%B8%8C%EB%A0%88%EC%9D%B4%EC%85%98-%EC%9B%B9%EC%97%90%EC%84%9C-%EC%95%BD%EC%8B%9D%EC%9C%BC%EB%A1%9C-%ED%95%98%EA%B8%B0

6개월간 하던 외주가 끝나고 요즘 개인적으로 진행하고 있는 프로젝트가 하나 있다 그래서 좀 많이 늘었는데 가능하면 2000개까지 뚫어보고 싶다

satisfactoryplace.tistory.com/154?category=829221 [React] MobX 개요 MobX란? 상태 관리 라이브러리다. 비슷한 종류의 대표적인 상태 관리 라이브러리로 redux가 있다. 개인적으로 redux의 지독한(...) 보일러플레이트에 깊은 빡침을 느껴 mobx를 사용해보려고 한다. 설명 satisfactoryplace.tistory.com 위 포스트에서 이어지는 내용이다. 이번엔 MobX로 실제로 어떤 것을 해볼 수 있는지를 살펴보자. 우선 observerable state의 위치에 따른(내부/외부) state사용법에 대해 알아볼 것이다. class Timer { secondsPassed = 0 constructor() { makeAutoObservable(th..

MobX란? 상태 관리 라이브러리다. 비슷한 종류의 대표적인 상태 관리 라이브러리로 redux가 있다. 개인적으로 redux의 지독한(...) 보일러플레이트에 깊은 빡침을 느껴 mobx를 사용해보려고 한다. 설명은 공식 문서를 기준으로 설명한다. mobx.js.org/README.html About MobX · MobX mobx.js.org 빠르게 알아보자 import React from "react" import ReactDOM from "react-dom" import { makeAutoObservable } from "mobx" import { observer } from "mobx-react" // Model the application state. class Timer { secondsPasse..

KYSC:: Keep Your Shaver Clean ========= What is KYSC? Using dirty and older shaver is very dangerous. That may cause hurt or infection... Now you just tap button in app whenever change shaver! KYSC let you know the day you should change your shaver using notification. source code is here ========= Privacy Policy KYSC is never collect any information including user privacy data. All data is saved..

6번의 떨어짐 끝에 드디어 애드센스 합격 통보를 받았다. (육전칠기....) 합격을 받기까지 거친 과정을 소개해 보려고 한다. 1. 사이트 성능 최적화 satisfactoryplace.tistory.com/122?category=829221 [React] React.memo를 이용한 함수 컴포넌트 최적화 https://ko.reactjs.org/docs/react-api.html#reactmemo React 최상위 API – React A JavaScript library for building user interfaces ko.reactjs.org 요즘 클래스형 컴포넌트를 갖다 버리고, 거의 함수 컴포넌.. satisfactoryplace.tistory.com 2. JS 실행을 지원하지 않는 봇(크롤러..

서치엔진이 웹 품질을 판단하는 데는 여러 기준이 있는데, 그 중 하나는 페이지별 적절한 메타 태그가 있느냐다. 리액트에서 해당 스펙을 구현하는 방법에 대해 소개할 것이다. 우선 /public/index.html의 head 태그 내부에 다음 태그를 추가한다. 위 메타 태그는 메신저/검색엔진 등에서 사이트 프리뷰를 표시할 때 사용한다. 가령 카카오톡에서는 다음과 같이 표시된다 이제 페이지 별로 해당 태그의 content를 조작하는 코드를 작성한다. const setMetaTags = ({ title="기본 타이틀", description="기본 설명", imageUrl="기본 사이트 이미지 경로" }) => { //set title document .querySelector('meta[property="og..

내 앱에서 갤러리 앱을 열고 선택한 사진을 내 앱에서 불러오는 기능을 구현한다. 파일 읽기 권한 추가 먼저 manifest.xml에 다음 권한을 추가하고, 마시멜로 이상의 Android 버전을 타게팅하는 경우 사용자에게 권한을 요청하여 받아낸다. 액티비티에서 갤러리 열기 우선 갤러리를 여는 코드부터 작성해 보자 public class SomeActivity extends FragmentActivity{ //... if(PermissionChecker.checkPermission(this, Manifest.permission.READ_EXTERNAL_STORAGE)){ //권한이 확인된 경우 갤러리 오픈 Intent i = new Intent(Intent.ACTION_PICK,android.provider..

사이퍼즈 서포터(CPSP)의 업데이트 로드맵을 알려드리고자 합니다. 상세 일정에 대해 정해진 것은 없으나, 어떤 순서로 업데이트해 나갈 것인지 안내드립니다. 1. 사이퍼즈 서포터 웹 버전 정식 출시 현재(2020-09-13 01:24)기준 아직 웹 버전은 프리뷰 버전입니다. 앱에 있는 기능 중 아직 추가되지 못한 기능과 자잘한 디자인/버그를 수정한 뒤 정식 버전을 출시할 예정입니다. 2. 통계 자체 수집 기능 현재 통계 페이지에서 제공되고 있는 기능은 사이퍼즈 공식 홈페이지 정보에 의존적입니다. 이는 캐릭터 정보 페이지의 포지션 통계/매치업/시너지 정보와는 통계 수집 기준이 달라 이용하시는 분들께 혼란을 드릴 수 있을 것 같습니다. 따라서 포지션 통계/매치업/시너지 정보 분석 시 사용한 표본들로 승률/픽..

앱을 개발하다 보면 디버그 모드에서만 활성화해야 하는 기능이 존재한다. 단적인 예로, 구글 애드몹의 경우 디버그 모드에서 광고를 초기화하는 행위가 누적되면 계정이 정지되기 때문에 디버그 모드에선 그것을 막아두어야 한다. 처음엔 노가다로 디버그 할 때는 주석처리 해두었다가 릴리즈 시 해당 주석을 해제하는 방법을 사용했지만, BuildConfig클래스를 안 뒤로는 손으로 하지 않는다. BuildConfig는 .BuildConfig 위치에 존재한다. 만약 내 applicationId가 com.example.www 라면 com.example.www.BuildConfig 위치에 있다. 해당 클래스로 버전 코드, 디버그 여부 등을 유용하게 쓰고 있었는데 간혹 릴리즈 모드에서도 DEBUG값이 false로 바뀌지 않는..

싸게 팔길래 하나 사와서 개발 테스트용으로 쓰고 있는 S10에 붙였다 쪼오끔 지저분하게 붙긴 했지만, 어차피 메인폰이 아니니 이정도로 충분하다. 먼저 손쉬운 부착이라고 상품에 써있지만 개구라다 필름이 일반 필름처럼 뻣뻣한 재질이 아니라 양쪽을 잡고 늘리면 쭈욱 늘어나는 재질이라 기포가 존나잘생기고 또 폰에서 떨어지지도 않는다 그래서 기포가 생기면 밀대로 밀어야 하는데 이것도 힘을 너무주면 필름이 늘어나거나 뜯어져서 힘조절하면서 하나씩 기포를 빼 줘야 한다 한 15분정도 박으면 해결된다 문제는 개쓰레기같은 빛 투과율이다 선명한 화면이라고 제품 앞면에 써놨으면서 얼마나 필름이 좆같은지 흰색 화면임에도 빨간색 파란색 초록색 흰색이 동시에 보인다 다시 말하지만 이건 카메라 화질이 안좋아서가 아니라 필름이 개쓰레..

요번에 여자친구가 컴퓨터 본체를 바꾸겠다고 해서 견적을 좀 내봤다. 다른것보다 우선순위가 높은 항목은 가격이기 때문에 "초저가"에 초점을 맞추되, 중고 부품을 사용하거나 너무 낮은 사양의 제품은 고려하지 않았다. 목표가는 30만원 이하로 잡았다. 희망 스펙 1. CPU: Ryzen 3200g 2. RAM: 8GB 3. Storage: SSD 256GB 4. MainBoard: A라인 5. Power: 500W 이하 이렇게 했을 때 약 26만원 정도에 부품을 각각 구매할 수 있었으나... 문제는 부품을 따로따로 구매하기 때문에 10000원이 넘는 택배비로 "초저가"와는 상충하는 면이 있다. 게다가 주문 즉시 당일발송하지 않는 업체도 간간히 있기 때문에 배송일이 너무 어긋나버리면 방에 애물단지처럼 공간만 차..

https://reactnative.dev/ React Native · A framework for building native apps using React A framework for building native apps using React reactnative.dev 리액트 네이티브는 크로스 플랫폼 애플리케이션 제작에 특화된 프레임워크다. 처음 들었을땐 안드로이드/웹을 따로 개발하는 나로써는 놀라움을 금치 못했고, 리액트 네이티브를 배우고 나서 이제 안드로이드 스튜디오는 쓰레기통에 박아버릴 예정이였으나... 시작할 때와는 생각이 많이 바뀌었다. 매도 먼저 맞는게 낫다고, 단점부터 얘기해보겠다. 너무 오래 걸리는 빌드 시간과 너무 거대한 프로덕션 물론 디버그의 경우에는 hot reload기능이 있어..

앱 아이콘은 만들었다고 해서 끝난 것이 아니다. 각 디바이스마다 적절한 크기가 있어서 해당 크기로 하나씩 변환해주어야 하는데, 상당히 귀찮은 작업이다. https://appicon.co/ App Icon Generator Generate icons and images for mobile apps, android and iOS. No need to upload or download. Works on your browser appicon.co 위의 링크를 이용하면 클릭 한 번에 필요한 사이즈별 아이콘이 제작되어 나온다.

Material Icons https://material.io/resources/icons/?style=baseline Material Icons Get Material Icons material.io 머터리얼 아이콘은 퀄리티가 좋은데다 머터리얼 테마에 잘 어울린다. 오픈소스라는 장점도 가지고 있어서 이 아이콘을 번들링해서 갖다 파는게 아니라면 자유롭게 이용할 수 있다. 다만 가짓수가 그렇게 많지는 않다는게 단점이다. Icon8 https://icons8.com/ Download free icons, music, stock photos, vectors Designers, download the design stuff for free — icons, photos, UX illustrations, and m..

2020년 6월 19일에 웹 프리뷰 버전을 출시한 이후, 현재 2020년 8월 19일 기준 14번의 릴리즈가 있었습니다. (패치노트: https://cpsp.kr/patchnotes) 또한 웹 버전 출시 당시 모바일/데스크탑 환경을 동시에 염두에 두고 개발했기 때문에 당장에 스마트폰 브라우저로 접속하더라도 큰 불편함 없이 사용이 가능했었죠. 그러나 본질적으로 브라우저를 키고 주소를 입력해서 들어와야 한다는 번거로움이 있었습니다. 그렇다고 Android/IOS앱을 각각 만들면, 기능 변경이 있을 떄 마다 3개의 언어로 프로그래밍된 앱을 모두 고쳐줘야 한다는 점도 부담스럽게 다가왔습니다. 이를 해결하기 위해 Hybrid Application으로 서비싱하는것을 채택했습니다. 잠깐 Application의 종류 ..