본문 바로가기

분류 전체보기280

이미지 최적화를 위한 HTML코드 alt text (alt description) 추가 이부분은 성능이 아닌 accessibility 향상을 위함 그래픽의 기능과 모양에 대한 정확한 맥락정보를 제공하는 대체 텍스트 일반적인 사용자뿐만이 아니라 장애가 있는 사용자들도 콘텐츠에 접근하도록 도움으로 접근성 향샹을 도움. 이미지의 순위를 상승히키고 더 많은 사용자를 끌어들이는 요소. 이로 인해 이미지 로드가 지연될때 대체 텍스트를 통해 어떤 이미지인지 알 수 있게 된다. 콘텐츠의 일부가 아닌 페이지의 외관을 향상시키기 위해서만 존재하는 배경 이미지에는 role 속서응로 "presentation"값을 지정해야한다. 참고 블로그 2022. 12. 7.
Promise.all과 Promise.allSettled의 차이점 이런 코드를 발견했다. await Promise.allSettled(SomthigPromiseList); Promise는 비동기 처리를 할 수 있는 객체인건 알겠는데 Promise 속성을 사용하는건 처음 봤다. 내가 정리해두었던 Promise 개념 -> https://hancoco.tistory.com/72 [220127] promise, then, resolve 목록 1. promise의 목적 2. promise의 매개변수 2가지 3. then 사용법 4. promise의 상태 3가지 5. resolve 사용하는 법 promise를 사용하기 위한 선수지식 : 객체와 this 간단 정리! this에 관한 자세한 설명은 아래 hancoco.tistory.com 개념 Promise.all() Promise... 2022. 12. 6.
import 에러 : 모듈 또는 해당 형식 선언을 찾을 수 없습니다.ts(2307) 리액트로 잘 쓰고있던 경로인데 찾을 수 없다고 뜬다. 이럴때는 타입스크립트가 파일의 추론을 잘 할 수 있게 돕는 d.ts 파일을 작성해줘야한다. https://hancoco.tistory.com/370 타입스크립트의 선언 파일 / d.ts 선언 파일이란? 타입스크립트 선언 파일 d.ts는 타입스크립트 코드의 타입 추론을 돕는 파일이다. 예를 들어 전역변수로 선언한 변수를 특정 파일에서 import 구문 없이 사용하는 경우 변수를 인식 hancoco.tistory.com 사용하고 싶은 확장자명을 작성해주면 에러표시가 사라진다. // custom.d.ts declare module "*.gif"; 2022. 12. 6.
타입스크립트로 Hooks(useState,useRef,reducer) 사용하기 기본구조 컴포넌트를 사용해야하기때문에 확장자를 tsx로 두었다. src ㄴ App.tsx ㄴ index.tsx // index.tsx import React from "react"; import ReactDOM from "react-dom/client"; import App from "./App"; const root = ReactDOM.createRoot( document.getElementById("root") as HTMLElement ); root.render( ); // App.tsx import React from "react"; const App = () => { return ( ); }; export default App; useState 사용하기 import React, { useStat.. 2022. 12. 6.
접속port를 영구적으로 바꾸는법 로컬 접속 포트를 영구적으로 3307번으로 바꾸기 SSH 터널링으로 3306번 포트에 접속했으니 나는 로컬에서 3307번 포트로 접속해주면 된다. 보통은 root에서 etc 폴더에 담겨있다는데 내 맥북은 m1칩을 가지고 있어서 없었다. 혹시 본인이 m1칩이 들어있는 맥북을 사용하고있고, homebrew로 mysql이나 mariadb를 설치했다면 opt 폴더에 담겨있다. /etc/my.cnf /etc/mysql/my.cnf /opt/homebrew/etc/my.cnf ~/.my.cnf 정 모르겠을때 shell에 다음 명령어를 입력하면 찾을 수 있다 $ mysql --verbose --help | grep my.cnf my.cnf 파일 안을 확인해보면 아무것도 설정한 것이 없기때문에 다음과 같이 나온다. $.. 2022. 12. 1.
SSH 터널링 명령어 한번에 이해하기 SSH(Secure Shell Protocol)란? SSH 프로토콜(Secure Shell이라고도 함)은 한 컴퓨터에서 다른 컴퓨터로 보안 원격 로그인을 위한 방법입니다. 강력한 인증을 위한 몇 가지 대체 옵션을 제공하며 강력한 암호화로 통신 보안 및 무결성을 보호합니다. 보호되지 않는 로그인 프로토콜(예: telnet , rlogin ) 및 안전하지 않은 파일 전송 방법(예: FTP ) 에 대한 안전한 대안 입니다. (ssh 공식홈페이지) SSH 포트 포워딩, 일명 SSH 터널링이란 무엇입니까? SSH 포트 포워딩은 클라이언트 시스템에서 서버 시스템으로 또는 그 반대로 애플리케이션 포트를 터널링하기 위한 SSH 의 메커니즘입니다. 방화벽을 통과 하는 레거시 응용 프로그램에 암호화를 추가하는 데 사용할 .. 2022. 11. 30.
우분투 서버에 mariadb 연결하기 & dbeaver 사용하기 기본 라이브러리 설치 대략적인 기본 세팅이 끝났기때문에 우분투 서버에 우선 기본 라이브러리들(nvm,node,npm)을 설치해놓았다. sudo apt update sudo apt upgrade -y sudo apt install -y build-essential sudo apt install net-tools sudo apt install curl ## nvm 설치 curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.35.3/install.sh | bash source ~/.bashrc ## nvm 버전확인 nvm --version ## nodejs LTS 설치 nvm install node --lts ## 설치된 노드 버전 확인 nvm ls node -.. 2022. 11. 25.
AWS 우분투 서버 생성&배포&DB연결까지 전체적인 구조도 Linux Ubuntu 서버 AWS에 배포 (EC2) CloudFlare 도메인 세팅 Git 동기화 (ssh key 세팅) Nginx 세팅 Certbot 세팅 데이터베이스(MariaDB) 설치 및 세팅 + DBeaver 설치 및 세팅 API 서비스 런칭 (미정리) API 서비스 코드 업데이트 및 재런칭 (작성중) 2022. 11. 25.
AWS로 생성한 퍼블릭 IPv4를 받아서 cloudflare 설정하기 cloudflare란 인터넷에서 운영되는 가장 큰 네트워크 중 하나다. 최대한 사용자와 가까운 곳에서 콘텐츠 및 기타 서비스를 제공함으로써 가장 빠른 시간 내에 정보를 얻을 수 있도록 하는 엣지 네트워크로 이루어져 있다. DNS와 내 IP 사이에 들어가서 DNS에서 보내는 요청을 cloudflare가 먼저 받는다. 그 중에서 필요한 요청만 내 IP에게 보내므로 서버의 부하를 줄일 수 있다. DNS란? 도메인 이름 시스템(DNS)은 사람이 읽을 수 있는 도메인 이름(예: www.amazon.com)을 머신이 읽을 수 있는 IP 주소(예: 192.0.2.44)로 변환한다. (참고 사이트) cloudflare 설정하기 IPv4 주소는 AWS에서 생성한 인스턴스를 클릭하면 볼 수 있다. 여기까지 설정하면 도메인.. 2022. 11. 24.
타입스크립트의 Mapped Type(맵드 타입) 타입스크립트에서 map처럼 타입을 각각 변환하는 방법이며 아래와 같은 형태의 문법을 사용해야 한다. { [ P in K ] : T } { [ P in K ] ? : T } { readonly [ P in K ] : T } { readonly [ P in K ] ? : T } 기본 예제 히어로들의 이름에 각각 나이까지 붙인 객체를 만들고 싶다면 아래와 같이 코드를 사용하면 된다. type Heroes = 'Hulk' | 'Thor' | 'Capt'; // for in 문법과 유사한 K in Heroes type HeroProfiles = { [K in Heroes]: number }; const heroInfo: HeroProfiles = { Hulk: 54, Thor: 1000, Capt: 33, } 위.. 2022. 11. 23.