본문 바로가기

반응형

IT

(289)
[TS]리액트 프로젝트 생성 npm init vite [프로젝트명] -- --template react-ts cd [프로젝트명] npm i 프로젝트 실행 npm run dev 부트스트랩 패키지 추가 npm i bootstrap 스타일을 책임지는 reactstrap 추가! npm i reactstrap 참고 링크! https://reactstrap.github.io/ Storybook reactstrap.github.io main.tsx 에 import 추가 - 모듈은 모듈이름으로 바로 임포트! vscode 약자는 imn import 'bootstrap/dist/css/bootstrap.css' npm i prop-types # prop의 타입을 체크하는 패키지 추가!
[TS]리액트 복습 - 모던 자바스크립트 1. let 과 const ES6(=ES2015) 부터 등장. 변수 선언시, var 가 아닌 let과 const 이용 : hoisting 둘리의 호이호이? 가 아닌 호이스팅 자바스크립트에서는 선언되는 변수와 함수를 소스전체에를 스캔하여 메모리에 할당 후 처리하기때문에 컴파일러 언어를 익힌 나같은 사람은 착각하기 쉬운 일이 발생한다. console.log(A1); //오류 안난다. undefined 라고만 나올뿐... var A1 = "hello"; var A1 = 100; // 중복선언해도 오류 안남.. 이런걸 해결해주는게 let ! 일반적인 언어같이 위에 것들을 막아줌.. const 는 상수 선언 2. 구조 분해 할당 let arr = [10,20,30,40]; let [a1, a2,a3] = arr;..
macOS 파이썬 버전 관리하기 with pyenv 참고사이트!! https://blog.eunsukim.me/posts/managing-python-versions-on-your-mac Pyenv로 MacOS에서 파이썬 버전 관리하기 Pyenv 를 활용하여 프로젝트 혹은 가상환경별로 서로 다른 파이썬 버전을 적용하는 방법에 대해서 알아봅시다. blog.eunsukim.me 1. 일단 설치 brew install pyenv 현재 기준 2.3.21 2. 설치 가능한 파이썬 리스트 확인 pyenv install -l 현재 가장 최신버전인 3.11.4 를 설치하기로 한다. 3. 파이썬 3.11.4 설치 pyenv install 3.11.4 4. 설치된 파이썬을 디폴트 버전으로 변경 pyenv global 3.11.4 잘된다! --추가적인 사항 1. 현재 활성화..
오프라인에서 폰트를 이용하는 방법 feat nodejs + fontsource.org 나같이 폐쇄망에서 일하는 사람은 퍼블링망이 연결되어 있지 않아, 웹링크로 폰트를 가져올 수 없다. 이럴때는 node 를 이용해 패키지로 설치해서 쓰면 좋다! 일단 fontsource.org 사이트에서 필요한 폰트를 찾는다. 해당 폰트 화면에서 install 탭을 누른다. 가이드가 나와있는데로 설치/링크설정/이용! 을 한다. //설치 npm install @fontsource/material-icons //index.css 에 추가 링크 import '@fontsource/material-icons'; //이용 home 이제 폐쇄망에서도 이쁜 아이콘과 폰트를 쓰자!!
[TS] 타입스크립트 설치, Vscode 셋팅 방법 1. 타입스크립트 설치하기 npm i -g typescript ts-node 2. 설치 확인 tsc -v ts-node -v 3. 유용한 vscode 플러그인 Prettier Tailwind CSS Headwind PostCSS Language SUpport 4. ts 실행하기 샘플파일! index.ts console.log("Hello World!"); ts-node index.ts 실행! 5. 프리티어 정리 샘플파일 더블쿼트 -> 싱글쿼트 변경 세미콜론 -> 제거 .prettierrc.js module.exports = { bracketSpacing: false, jsxBracketSameLine: true, singleQuote: true, trailingComma: 'none', arrowPare..
[NodeJS] 윈도우에서 Scoop 를 이용한 nodejs 설치 1. 일반 파워쉘을 실행 2. 다음 명령어를 차례대로 실행(Scoop 설치) $env:SCOOP='C:\Scoop' [Environment]::SetEnvironmentVariable('Scoop',$env:SCOOP, 'User') Set-ExecutionPolicy -ExecutionPolicy RemoteSigned -scope CurrentUser # 질문창이 나오면 A 모두 Yes 선택.. 난 안나옴 iwr -useb get.scoop.sh | iex # scoop 설치! 3. scoop 를 이용한 git aria2 설치 scoop install git aria2 4. scoop를 이용한 nodejs 설치 scoop install nodejs-lts # 현재버전 : 18.16.0 5. scoop..
[Flutter] 외부 image 리소스 추가하고 보여주기 준비물 : 보여줄 이미지 파일 하나! ( png 파일만 됩니다.. jpg 안됨... ) 따로 귀찮으신분은 우리집 강아지 파일을 샘플로 쓰면됨! 1. 신규 프로젝트 생성 프로젝트명 : sample_image_display //플러터는 프로젝트에 대문자 못씀 나머지는 굳이 똑같이 안해도 됨.. 2. 외부이미지 추가 루트 폴더 밑에 assets 라는 폴더를 만든다. ( 폴더명은 임의로 만들어도 됨 ) 거기에 보여줄 이미지 파일을 복사한다. 3. 이미지 폴더 지정 pubspec.yaml 파일을 연다. 주석이 처리되어 있는 이미지 폴더 지정 부분을 찾는다. # assets: # - images/a_dot_burr.jpeg # - images/a_dot_ham.jpeg 주석을 해제 하고, 방금 생성한 폴더를 써준다..
고급 페이지 구축으로 앱 만들기 - 7. 앱 번역하기 7.1 소개 https://academy.mendix.com/link/modules/187/lectures/1464/7.1-Introduction 모듈 6을 완료하지 못했다면 이 페이지 상단에 있는 프로젝트 패키지(mpk 파일)를 다운로드하여 이 학습을 계속 진행하세요 수고하셨습니다! 앱의 첫 번째 버전이 완성되어 보스턴에 있는 팀에서 테스트를 마쳤습니다. 이제 로테르담에 있는 팀을 위해 네덜란드어로 앱을 출시할 차례입니다! 네, 맞습니다. 앱을 다국어로 만들어야 합니다. 7.2 언어 설정 국제적인 비즈니스 세계에 살고 있는 우리는 전 세계의 사용자와 고객을 상대하게 됩니다. 가능한 한 많은 사람들에게 서비스를 제공하기 위해 여러 언어로 앱을 제공하도록 선택할 수 있습니다. 멘딕스를 사용하면 앱을 쉽게 ..

반응형