전체 글79 CDN과 jsdelivr, 5월 2일 발생한 인증서 에러 jsdelivr란?jsdelivr는 무료로 사용할 수 있는 오픈소스 CDN(Content Delivery Network) 서비스입니다.CDN은 사용자와 가까운 서버에서 콘텐츠를 제공하여 웹사이트의 로딩 속도를 높이는 기술입니다.jsdelivr를 사용하면 GitHub 저장소에 있는 파일을 빠르게 전송받을 수 있습니다.2024년 5월 2일 SSL 인증서 만료 에러2024년 5월 2일에 jsdelivr의 SSL 인증서가 만료되면서 다음과 같은 문제가 발생했습니다:웹 폰트 로딩 오류npm 모듈 서명 문제다른 웹사이트에서도 관련 오류 발생이로 인해 jsdelivr 서비스를 사용하는 웹사이트에서 다양한 문제가 발생했습니다.사용자들은 cdn.jsdelivr.net 주소를 사용하지 않도록 주의해야 했습니다.jsdeli.. 2024. 5. 2. 리액트 네이티브 웹뷰에 user agent를 추가하는 방법 안녕하세요. 리액트 네이티브 웹뷰에 user agent를 추가하는 방법에 대해 자세히 알아보겠습니다.요약리액트 네이티브 앱에서 웹뷰를 사용할 때, 사용자 에이전트(user agent) 정보를 변경하여 전송할 수 있습니다. 이는 특정 웹 서비스에서 발생할 수 있는 오류를 해결하는 데 도움이 될 수 있습니다.리액트 네이티브 웹뷰에 user agent 추가하기1. react-native-webview 패키지 설치리액트 네이티브 프로젝트에 react-native-webview 패키지를 설치합니다.npm install react-native-webview 또는 yarn add react-native-webview2. user agent 설정WebView 컴포넌트에 userAgent 속성을 추가하여 사용자 에이전트.. 2024. 5. 2. [Next.js] package.json 파일의 dev, build, start 스트립트 스크립트 살펴보기Next.js 프로젝트의 package.json 파일에는 일반적으로 다음과 같은 스크립트가 포함됩니다:dev: 개발 모드에서 Next.js 애플리케이션을 실행합니다.build: Next.js 애플리케이션을 프로덕션 빌드로 준비합니다.start: 프로덕션 빌드된 Next.js 애플리케이션을 실행합니다.dev 스크립트개발 모드에서 Next.js 애플리케이션을 실행합니다.코드 변경 시 자동으로 새로고침되어 즉시 반영됩니다.디버깅 및 개발 목적으로 사용됩니다.build 스크립트Next.js 애플리케이션을 프로덕션 빌드로 준비합니다.최적화된 HTML, CSS, JavaScript 파일을 생성합니다.정적 파일 및 서버 사이드 렌더링(SSR) 코드를 포함합니다.배포를 위해 애플리케이션을 준비하는 데 .. 2024. 5. 2. React Native와 Next.js로 웹뷰 개발하기 React Native와 Next.js를 사용하여 웹뷰를 개발할 때 고려해야 할 사항들을 자세히 살펴보겠습니다.요약React Native와 Next.js를 활용하여 웹뷰 기반 모바일 앱을 개발할 때는 각 프레임워크의 장단점을 잘 파악하고 적절히 활용해야 합니다. 성능, 배포, 개발 생산성 등 다양한 측면에서 고려사항이 있으며, 사용자 경험을 저해하지 않도록 주의해야 합니다.React Native와 Next.js로 웹뷰 개발하기1. React Native 웹뷰 개발React Native에는 내장된 WebView 컴포넌트를 사용하여 웹 콘텐츠를 앱에 임베딩할 수 있습니다.디바이스 호환성, 스타일링, 레이아웃 등 React Native 고유의 특성을 고려해야 합니다. [1]성능 및 사용성 문제를 방지하기 위한.. 2024. 5. 2. [Next.js] App Router와 Pages Router의 특징 요약Next.js 13에서 도입된 App Router는 기존의 Pages Router와 다른 새로운 라우팅 방식입니다.App Router는 React의 최신 기능을 활용하여 애플리케이션을 구축할 수 있도록 하며, 라우팅과 레이아웃 경험을 개선합니다.Pages Router정의: 이전 버전의 Next.js에서 사용되던 라우팅 방식특징:/pages 디렉토리에 페이지 컴포넌트를 배치파일 이름이 곧 URL 경로가 됨페이지 간 상태 공유가 어려움레이아웃 구현이 복잡함App Router정의: Next.js 13에서 도입된 새로운 라우팅 방식특징:/app 디렉토리에 라우팅 및 레이아웃 구현컴포넌트 간 상태 공유가 용이레이아웃 구현이 간단해짐Server Components 아키텍처 지원스트리밍 및 Suspense 기능 .. 2024. 5. 2. [Next.js] CSR, SSG, ISR, SSR의 차이점과 장단점 요약CSR(Client-Side Rendering), SSG(Static Site Generation), ISR(Incremental Static Regeneration), SSR(Server-Side Rendering)은 웹 애플리케이션의 렌더링 방식에 따라 구분되는 개념입니다.각각의 방식은 장단점이 있으며, 웹 애플리케이션의 특성에 따라 적절한 방식을 선택해야 합니다.CSR (Client-Side Rendering)정의: 클라이언트(브라우저)에서 JavaScript를 실행하여 HTML을 생성하는 방식장점:빠른 초기 로딩 속도서버 부하 감소동적인 UI 구현 용이단점:초기 로딩 시 JavaScript 파일 다운로드 필요SEO 최적화 어려움자바스크립트 의존성 높음보안 취약점 존재SSG (Static Sit.. 2024. 5. 2. [JavaScript] Strict Mode 엄격 모드 Use Strict use strict 지시자를 사용하면, ECMAScript5(ES5) 이후 추가된 새로운 기능과 변경사항이 활성화 된다. 등장 배경 자바스크립트는 다양한 브라우저에서 작동해야 하기 때문에 기존의 기능을 변경하지 않고 새로운 기능을 추가하며 호환성을 유지해왔다. 덕분에 옛날에 작성된 코드를 지금도 사용할 수 있다는 장점이 있지만, 업데이트 전 코드의 결함이 그대로 박제된다는 단점이 있다. ES5 이후에는 새로운 기능을 추가하면서 기존 기능 일부를 변경했기 때문에 하위 호환성 문제가 발생할 수 있다. 따라서 느슨한 모드(sloppy mode)를 기본으로 하되, use strict 지시자를 사용한 엄격 모드(strict mode)에서만 변경사항이 활성화되게 했다. Strict Mode가 에.. 2022. 10. 27. [MacOS] 맥북 스크린샷 그림자 없애기 (창 캡쳐) 그림자 없애기 터미널에서 아래 명령어 입력 그림자 해제 defaults write com.apple.screencapture disable-shadow -bool true 그림자 설정 defaults write com.apple.screencapture disable-shadow -bool false As-Is 맥북에서 cmd+shift+4+space 단축키로 창 캡쳐 시 기본적으로 이미지에 그림자가 포함되어 저장된다. 정말 아름답지만, 게시글을 쓸 때 공간 낭비가 생기고 그림자까지 고려해야 하니 이미지 사이즈 조절이 힘들다. To-Be 그림자가 없어져서 이미지 경계가 뚜렷해지고 깔끔해졌다. 2022. 10. 27. 이전 1 2 3 4 5 6 ··· 10 다음
