JudithHopps JudithHopps

설치 및 세팅 설치 npm install jest --save-dev 개발환경에서만 테스트를 사용을 하니 개발환경에 설치 세팅 npm test를 치면 테스트가 가능 ~.test.js 에 해당하는 파일을 전부 검사 참고 : https://www.youtube.com/watch?v=g4MdUjxA-S4 Matcher toBe test("1은 1이야", () => { expect(1).toBe(1); }); expect : test할 값 toBe : 예상하는 값 test("1은 2가 아니야", () => { expect(1).not.toBe(2); }); 부정값을 예상하는 경우 test("0.1+0.2 = 0.3??", () => { expect(fn.add(0.1, 0.2)).toBeCloseTo(0.3);..

에러 내용 : 에러 이유 : Android SDK의 빌드 도구(Build Tools) 버전 33.0.0이 손상되어 발생한 이슈이다. 해결 방법 : sdk 폴더에서 33.0.0 파일을 열어서 d8을 dx로 수정해야 한다. 필자의 case는 33.0.0 폴더는 library>build-tools>android>sdk>33.0.0에 있었다. 참고로 터미널에서 파일을 찾으면 된다. d8 파일을 찾아 dx로 수정해주고, lib 폴더 안에 d8.jar 파일을 dx.jar 파일로 수정해주세요 dx와 d8이 뭔가요? Android SDK 33.0.0 패키지에서 dx와 d8은 Android DEX 컴파일러의 버전을 나타냅니다. dx: dx는 Android SDK 이전 버전에서 사용되던 DEX 컴파일러입니다. DEX(Da..

리액트 네이티브를 사용하기 위해 안드로이드 스튜디오 설치할 때 이런 에러가 뜰 수 있다. 최근에 adopt8-hospot의 명칭이 바뀌었다고 한다. 아주 최근에 일어나서 구글링이 되지 않았다... ​ java/adopt8-hotspot를 java/termurin8-jdk로 변경하면 설치할 수 있다. scoop install java/temurin8-jdk

리액트 네이티브를 사용하기 위해 안드로이드 스튜디오 설치할 때 이런 에러가 뜰 수 있다. extras를 설치하면 에러를 해결 할 수 있다. 아래 문장을 입력하면 해결된다. scoop bucket add extras scoop install android-studio android-sdk

리액트 네이티브란? 리액트 프레임워크는 2013년에 페이스북에서 발표한 오픈 소스 JS 프레임워크이다. 가상 DOM과 JSX를 사용하여 웹 프론트 개발할 때 사용한다. 리액트 네이티브 소개 리액트 네이티브 프레임워크는 2015년에 페이스북에서 발표한 모바일 앱 프레임워크이다. 안드로이드와 ios 모두 동작하고 네이티브 파트와 JS 파트로 구성된다. 개발자는 JS 코드만 작성하면 크로스플랫폼 app 을 개발 할 수 있다. 따라서 JS 또는 TS만 알고 있는 웹 개발자도 크로스플랫폼 모바일 앱 제작이 가능하다. 리액트 네이티브 개발 환경 기본적으로 Node.js 개발 환경과 같다. 윈도우의 경우) Scoop 설치 - 윈도우 오른쪽 버튼을 클릭하면 [powershell(관리자)] 를 볼 수 있다. - [pow..

레이아웃 헤더에서 컴포넌트별 이미지 차이 주기 페이지에서 레이아웃 구성요소 사용시 `처럼 사용하여 {home ? () : 뷰 ? () : () } ③을 사용해서 코드 간편화 componenet/Layout.js {home ? ( {name} ) : (vue ? ( 뷰진스 ) : angular ? ( 앵진스 ) :( h진스 ) ) }

next.js Css Next.js에서 지원 하는 스타일 지정 방법 CSS 모듈 styled-jsx 사스 styled-components는 지원하지 않는다. 레이아웃 구성 요소 먼저 모든 페이지에서 공유할 레이아웃 구성 요소를 만들어 보겠습니다 . component 폴더와 Layout.js 파일을 생성합니다. export default function Layout({ children }) { return {children}; } 그런 다음 를 열고 구성 요소 pages/posts/first-post.js에 대한 가져오기를 추가 Layout하고 가장 바깥쪽 구성 요소로 만듭니다. import Head from 'next/head'; import Link from 'next/link'; import Layo..

메타데이터 HTML title 태그 와 같은 페이지의 메타데이터를 수정하는 방법은 아래와 같다. import Head from 'next/head' import Link from 'next/link'; export default function First () { return ( Hello go Home ) } 그럼 아래 처럼 탭의 제목이 바뀐다. Script 타사 스크립트 로드를 단순화한다. import Script from 'next/script'; export default function FirstPost() { return ( console.log(`script loaded correctly, window.FB has been populated`) } /> First Post ← Back to ..