본문 바로가기

IT 개발, develop71

[react] vs code snippets 플러그인 설치 - snippets 는 자주 사용되는 코드 덩어리를 자동으로 생성해주는 vs codd 플러그인 입니다. - vs code 왼쪽 메뉴에서 extensions(확장) 클릭 > 'reactjs code snippets' 검색 > install 을 눌러 설치하면 됩니다. - 에디터에서 rscm 을 입력하면 선택 select box가 나옵니다. rscm을 선탁하면 자동으로 rscm 코드가 생성됩니다. 2024. 1. 22.
[nvm] nodejs, nvm 설치 / create-app 프로젝트 만들기 - nodejs 는 구글에서 공개한 S/W로 V8엔진을 기만으로 만든 javascript 런타임 도구 입니다. - nodejs 는 브라우저가 아닌, 컴퓨터에서 javascript 를 실행할 수 있도록 도와주는 도구 입니다. - nvm 은 nodejs 설치 및 버전 관리를 해주는 프로그램 입니다. https://github.com/coreybutler/nvm-windows/releases - nodejs 설치하기 >nvm install 버전 - 버전 확인 - yarn 설치하기 - react 앱 생성하기 yarn create react-app example1 .. .. - 생성한 앱 시작하기 >cd example1 >yarn start - 브라우저에서 접속 http://localhost:3000/ 2024. 1. 22.
[raact] 웹팩(webpack) - 웹팩은 프로젝트에 사용된 파일을 분석하여 기존 웹 문서 파일로 변환하는 도구 입니다. - .sass, .cjs 같이 블라우저가 해석할 수 없는 파일을 분석하여 변환해 줍니다. https://webpack.kr/ 2024. 1. 22.
[react] 노드 패키지 매니저 (npm) - 노드패키지매니저 npm 은 https://www.npmjs.com 에서 필요한 라이브러리를 내려받아서 설치할 수 있도록 관리를 도와주는 프로그램 입니다. - 다운받은 라이브러리는 node_modules 에 저장되며, 라이브러리의 정보는 packages.json 에 저장됩니다. 2024. 1. 22.
[react] react 의 특징? - 리액트는 많이 쓰이고 있는 프론터앤드 프레임워크 중에 하나 입니다. - 리액트는 화면 출력에 특화된 프레임워크이다. - 리액트는 컴포넌트(component) 라는 작고 독립적인 코드 블록을 조합하여 빠르고 효율적으로 화면을 구성합니다. - 리액트는 가상돔(Virtual-DOM) 기술을 사용합니다. 2024. 1. 22.
[react] useEffect 가 2번 호출 될 때.. 함수형 컴포넌트를 이용해서 코딩을 하고 있었다. 최초 1번만 실행되기를 기대하고.. 다음과 같이 작성했으나... 계속 로그가 2번 찍힌다.. useEffect(() => { console.log("1"); },[]); 검색 결과 index.js 에 StrictMode 를 지우라는... 허망하다.. 참고) https://velog.io/@gene028/%EA%B0%9C%EB%B0%9C%EC%9D%BC%EC%A7%80-3-UseEffect%EB%8A%94-%EC%99%9C-%EB%91%90%EB%B2%88-%EC%8B%A4%ED%96%89%EB%90%98%EB%8A%94%EA%B1%B8%EA%B9%8C [개발일지 #3] UseEffect는 왜 두번 실행되는걸까? 팀원들과 카카오 로그인 구현 중.. 인가코드를.. 2023. 11. 2.
[react] redux, reducer, store 컴포넌트 외부의 스토어 라는곳에서 데이터를 관리한다. redux, resucer, store 글로 정리할까 하다가 정리가 잘 되어 있는 곳이 있어서 링크를 적어봅니다. https://kyounghwan01.github.io/blog/React/redux/redux-basic/#reducer-%E1%84%8C%E1%85%A5%E1%86%BC%E1%84%8B%E1%85%B4 https://blog.naver.com/byungjoo0806/223234739361 2023. 11. 1.
[react] context 이해가.. react 에서 전역에 무언가 저장해놓고 꺼내쓰고 싶을 때 context를 사용하면 될 것 같다. 찾아봤는데, 아래 설명이 좀 이해하기 편하다. https://www.daleseo.com/react-context/ React Context 사용법Engineering Blog by Dale Seowww.daleseo.com 부모 컴퍼넌트에서 생성한 데이터에 모든 자식들이 접근할 수 있다고 한다. 그러면.. 자식이 생성한 데이터 부모가 접근이 가능할까.... 이러한 문제 해결을 위해서 redux를 사용한다는데.. 2023. 11. 1.
[flutter] windows 에 설치 & android webview app 만들어보기 flutter 를 윈도우에 설치해 봅니다. https://docs.flutter.dev/get-started/install/windows flutter_windows_3.13.7-stable.zip 다운로드 적당히 풀고 bin 디렉토리까지를 path에 추가해 줍니다. ex) C:\dev\flutter_windows_3.13.7-stable\flutter\bin cmd 창에서 flutter docker 실행으로, 설정을 완료하는 데 필요한 플랫폼 종속성이 있는지 확인해 봅니다. 다음으로 몰 해야 할까요......^^;;;; 안드로이드 app 을 만들어 볼려고 합니다. 안드로이드 스튜디오를 다운 받으라고 하네요. 설치 합니다. https://developer.android.com/studio android .. 2023. 10. 18.