본문 바로가기

반응형

Web

(53)
[JS] ubuntu 18.04 npm install Error (feat. gyp) (AWS EC2) ubuntu 18.04 에서 npm install을 하니 error가 주구장창 나온다. npm version 8.5.0 node version v16.14.0 해결 https://24hours-beginner.tistory.com/21 Ubuntu 18.04 node-gyp rebuild error https://askubuntu.com/questions/1057737/ubuntu-18-04-lts-server-npm-depends-node-gyp-0-10-9-but-it-is-not-going = 0.10.9) but it is not going to be installed" data-og-description="My environment is.. 24hours-beginner.tis..
[React] CRA에서 Eject 사용 안하고 webpack custom 하기(customize-cra, react-app-rewired, 웹팩 설정 오버라이딩) ecject은 custom을 할 수 있는 정말 좋은 기능이지만 그거에 따른 부작용이 좀 많다. 그럼에도 불구하고 장점이 많아서 eject을 했는데 eject을 안해도 된다는 신박함을 알게 되어 포스팅 해본다. custom은 ecject만큼은 아니라고 하지만.. 음.. 괜찮은듯 하다. 상세한 설명이 필요하면 아래 링크를 들어가보자. https://medium.com/@jsh901220/create-react-app%EC%97%90%EC%84%9C-eject%EC%82%AC%EC%9A%A9%EC%95%88%ED%95%98%EA%B8%B0-customize-cra-react-app-rewired-10a83522ace0 Create-React-App에서 Eject사용안하기(customize-cra, react-..
[React] React 초보? 참고 사이트 추천 Create-React-App에서 Eject사용안하기(customize-cra, react-app-rewired) https://medium.com/@jsh901220/create-react-app%EC%97%90%EC%84%9C-eject%EC%82%AC%EC%9A%A9%EC%95%88%ED%95%98%EA%B8%B0-customize-cra-react-app-rewired-10a83522ace0 Create-React-App에서 Eject사용안하기(customize-cra, react-app-rewired) CRA를 쓰는 이유 medium.com Memoization으로 더 빠른 React Apps 만들기 https://junghan92.medium.com/%EB%B2%88%EC%97%AD-memoi..
[웹 보안] XSS / CSRF / SQL INJECTION iframe 사용을 지양하는것이 좋다는 말을 듣고 왜? 라는 생각이 들었으며 그 원인을 찾아보는 중 XSS 와 CSRF 키워드가 나왔다. https://program-developer.tistory.com/99 XSS와 CSRF(XSRF)의 차이점 사이트 간 스크립팅(XSS: Cross-Site Scripting) 웹 애플리케이션에서 많이 나타나는 취약점의 하나로, 웹사이트 관리자가 아닌 이가 웹 페이지에 악성 스크립트를 삽입할 수 있는 취약점이다. - 이 취 program-developer.tistory.com 1. XSS (Cross-Site Scripting) 요약 키워드 : SCRIPT 삽입, Client 공격 요약 : 웹사이트 관리자가 아닌 이가 웹 페이지에 악성 스크립트를 삽입할 수 있는 취약..
[React] 소스 맵(Source Map) sourcemap 이란? 소스 맵(Source Map)이란 배포용으로 빌드한 파일과 원본 파일을 서로 연결시켜주는 기능입니다. 보통 서버에 배포를 할 때 성능 최적화를 위해 HTML, CSS, JS와 같은 웹 자원들을 압축합니다. 그런데 만약 압축하여 배포한 파일에서 에러가 난다면 어떻게 디버깅을 할 수 있을까요? 정답은 바로 소스 맵을 이용해 배포용 파일의 특정 부분이 원본 소스의 어떤 부분인지 확인하는 것입니다. 이러한 편의성을 제공하는 것이 소스 맵입니다. sourcemap 확인하기 프로젝트를 build하고 나면 기본적으로 소스가 그대로 보인다. 크롬 기준 > 개발자 도구(ctrl+shift+i or F12) > Sources 이걸 소스맵(sourcemap)이라고 한다. 이럴 경우 내가 만든 모든게..
[React] GENERATE_SOURCEMAP=false build error (feat. windows 10) 아래와 같이 build를 했을 경우에는 문제가 없었다. package.json // package.json "scripts": { "build": "react-scripts build", }, // or "scripts": { "build": "react-scripts build && gulp licenses", }, 그런데 sourcemap 제거를 위하여 아래와 같이 GENERATE_SOURCEMAP=false 옵션을 줬더니 에러가 났다. // package.json "scripts": { "build": "GENERATE_SOURCEMAP=false react-scripts build", }, 'GENERATE_SOURCEMAP'은(는) 내부 또는 외부 명령, 실행할 수 있는 프로그램, 또는 배치 파..
[typescript] interface 키값이라고 하기 export interface IAccountTableHead { id: string | number; name: string; code_role: string; username: string; code_grade: string; button_farm_manage: {text: string, fn: ({...args}:{[key:string]: any}) => JSX.Element}; FarmMonitoring: string; } const TableHead: IAccountTableHead = { id: "ID", code_role: "구분", username: "아이디", name: "이름", code_grade: "등급", button_farm_manage: {text: "시설관리", fn : fu..
[Javascript][공부하자] Higher-Order Function (HOF) const a = function(fn) { return function (...args) { return fn(...args); }; }; const b = function(a,b) { return a+b; }; const c = a(b); c(1,2); /* print 3 */ a(b)(1,2); /* print 3 */ https://medium.com/@la.place/higher-order-function-%EC%9D%B4%EB%9E%80-%EB%AC%B4%EC%97%87%EC%9D%B8%EA%B0%80-1c61e0bea79

반응형