728x90 반응형 전체 글107 [WSL] WSL, Docker에서 Node 개발환경 설정 - 도구 설치 및 연동 개요Docker는 리눅스 환경을 기반으로 설정되어 있기 때문에, Windows에서 mount나 파일 수정 같은 작업에서 제약을 느끼곤 합니다. 리눅스 환경으로 접근하는 방법은 다양하지만, 이번 포스팅에서는 WSL을 사용하여 리눅스에 접근하고 설정하는 방법을 다루려고 합니다.또한, 리눅스로 설정된 환경에 노드 프로젝트를 띄우기 위해 필요한 도구들을 설치하고, Windows 앱에 설정을 해준 뒤 프로젝트 환경을 구축해보려고 합니다. WSL (Windows Subsystem for Linux)란 무엇인가. 윈도우 운영체제에 포함된 리눅스용 하위 시스템별도의 가상 머신 또는 이중 부팅 없이 Windows 컴퓨터에서 Linux 환경을 실행할 수 있는 Windows의 기능을 지원해준다.Windows와 Linux를.. 2024. 8. 30. [React] React-Router의 Hooks - useLocation 사용법과 활용 사례 useLocation 정의useLocation는 현재 location객체를 반환합니다. 현재 위치가 변경될 때마다 어떤 부작용을 수행하고 싶을 때 유용할 수 있습니다. 기본 코드 예제import * as React from 'react';import { useLocation } from 'react-router-dom';function App() { let location = useLocation(); React.useEffect(() => { // Google Analytics ga('send', 'pageview'); }, [location]); return ( // ... );} TypeScript 코드 예제declare function useLocation(): L.. 2024. 8. 22. [window] npm : 이 시스템에서 스크립트를 실행할 수 없으므로 C:\Program Files\nodejs\npm.ps1 파일을 로드할 수 없습니다. 상황window에 npm을 사용하여 도구를 설치하려고 하는데, 실패했다.node, nvm은 버전이 조회되는데 npm은 아래 '오류 내용'처럼 보여졌다. 오류 내용npm : 이 시스템에서 스크립트를 실행할 수 없으므로 C:\Program Files\nodejs\npm.ps1 파일을 로드할 수 없습니다. 자세한 내 용은 about_Execution_Policies(https://go.microsoft.com/fwlink/?LinkID=135170)를 참조하십시오. 위치 줄:1 문자:1 + npm install -g n + ~~~ + CategoryInfo : 보안 오류: (:) [], PSSecurityException + FullyQualifiedErrorId : Unaut.. 2024. 8. 13. [Git] Git 명령어 CLI 정리 개요각 명령어와 예제를 통해 Git 작업을 보다 쉽게 이해하고 사용할 수 있게 자주 사용하는 cli를 정리해보자 저장소 관리1. 새로운 저장소 생성- 현재 폴더에서 새로운 git 저장소를 생성$ git init 2. 기존 소스코드 다운로드/복제- 기존 소스코드를 로컬 저장소에 다운로드 및 복제, 원격 서버 저장소도 복제 가능$ git clone # 로컬 저장소 복제$ git clone /로컬/저장소/경로# 원격 저장소 복제$ git clone 사용자명@호스트:/원격/저장소/경로3. 원격 저장소 추적 확인$ git remote -v4. upstream 원격 저장소 설정$ git remote add upstream 소스 관리1. 특정 파일 추가$ git add // git add filename.txt .. 2024. 6. 17. [CS] SW 시각화 도구 - UML 다이어그램, 플로우 차트, 마인드 맵 개요프로젝트를 관리하면서 코드나 텍스트보다 더 쉽게 이해하기 위해 이미지로 표현해야할 때가 있다.혼자 보는 문서라면 원하는 도형과 화살표를 가지고 만들어도 괜찮다. 하지만 다른 사람과 공유하고 싶다면 기존에 만들어진 정의와 규칙를 지키는 것이 좋다. 사실 이러한 점을 인지하고 있어도 비슷비슷해보이는 시각화 도구들은 헷갈린다. 그러다 오늘 아무도 이해하지 못하는 문서를 만들었다.그리고 훌륭한 공학자들이 과학적으로 만든 규칙들은 다 의미가 있다는 것을 오늘 다시 인지하게 되었다. 이번 기회를 통해 다시한번 시각화 기법들을 정리하게 되었다. 이 포스팅은 시각화 기법과 해당 기법을 사용하는 목적, 상세 종류과 규칙들을 정리하는 포스팅이다. 지금까지 들어 본 기법들라이프사이클 다이어그램액티비티 유즈 다이어그램블록.. 2024. 6. 14. [JavaScript] Bun 소개 / 자바스트립트 런타임 비교 Incredibly fast JavaScript runtime, bundler, test runner, and package manager -- all in one(믿을 수 없을 정도로 빠른 JavaScript 런타임, Bundler, Test Runner 및 Package Manager - 모두 하나로) 개요최근에 Bun 이라는 도구를 발견했다. 알고보니 이미 2023년 인기 오픈소스로 선정 된 Bun !웹 서버 성능이 매우 우수하다는 평가를 들었고, 번들링과 테스팅 기능도 함께 갖추고 있다고 해서 호기심이 생겨 공식 홈페이지를 찾아보고 동작 방식을 간단히 이해를 기반으로 Bun 포스팅을 작성하고자 한다. ** 오픈 소스 트랜드는 어디서 알 수 있는가! https://risingstars.js.or.. 2024. 5. 31. [CSS] px, em vs rem 이해하기 CSS 길이 단위pxemrem px웹에서 가장 일반적으로 사용되는 단위이론적으로 화면의 1픽셀렌더링된 값이 변하지 않는 고정된 단위 empx단위와 다르게 상위 요소의 글꼴 크기를 기준으로 하는 상대적인 단위1em 단위는 현재 글꼴 크기의 높이와 같으며 기본값은 약 16pxem 단위는 비례적으로 크기가 조정되므로 상위 요소의 글꼴 크기에 영향을 받는다. rem“root em”의 줄임말rem 단위는 글꼴 크기에 비례한다는 점에서 em 단위와 비슷하지만 루트 요소(HTML 요소)만을 사용하여 글꼴 크기를 계산rem 단위는 글꼴 크기 조정 기능을 제공하지만 상위 글꼴 크기의 영향을 받지 않는다. em, rem 적합한 사용 기준보통 글꼴 크기 조정에 필요한 제어 수준과 예측 가능성에 따라 em 단위와 rem 단위.. 2024. 5. 30. [WEB] WEB 구성요소 / Web, WebServer, WAS 차이점 WEB 구성 요소Web인터넷을 기반으로 정보를 공유, 검색 하는 서비스이며 Web Browser를 통해 다양한 서비스를 제공한다.HTML(Hypertext Transfer Protocol)언어를 기반으로 문서와 링크를 생성하여 웹사이트를 구성한다.HTTP(Hypertext Transfer Protocol) 프로토콜을 사용하여 정보를 공유한다.URL(Uniform Resource Locator)은 인터넷상의 리소스를 나타내는 주소이다.Web BrowserWeb server와 통신하여 HTML 문서나 파일을 출력하는 GUI형식의 소프트 웨어Web PageWeb Browser에 표시되는 각각의 화면Firefox, 구글 크롬, 오페라, MS 익스플로러나 엣지, 애플의 Safari 같은 웹 브라우저에서 보여지는 .. 2024. 5. 27. [WEB] HTTP/HTTPS Methods, status code HTTP(HyperText Transfer Protocol)웹 서버와 클라이언트 간의 데이터 통신을 위한 프로토콜데이터 전송 과정에서 암호화가 이루어지지 않기 때문에, 전송되는 데이터가 평문으로 전송중간에 데이터를 가로채거나 엿볼 수 있는 보안 취약점이 존재PORT : 80http://example.com HTTPS(HyperText Transfer Protocol Secure)보안 소켓 계층(SSL/TLS) 위에서 HTTP 통신을 하는 보안된 프로토콜HTTP의 보안 버전으로, SSL(Secure Socket Layer) 또는 TLS(Transport Layer Security) 프로토콜을 사용하여 데이터가 암호화되어 전송중간에 데이터를 가로채도 암호화된 데이터를 해독할 수 없어서 데이터의 기밀성과 무.. 2024. 5. 27. 이전 1 2 3 4 5 ··· 12 다음 728x90 반응형
