분류 전체보기

해당 글의 목적은 React Native 개발을 하기에 앞서서, React Native에 대한 정의와 개발 방식(expo-cli / react-natvie-cli)에 대해 장단점을 알고 선택을 돕기 위한 목적으로 작성한 글입니다. 1) React Native 💡 React Native 란? - 리액트 네이티브는 페이스북에서 만든 오픈소스 모바일 애플리케이션 프레임워크입니다. - JavsScript로 개발하며 IOS나 Andriod, Web, UWP에 대한 모바일앱을 동시에 개발을 할 수 있는 크로스 플랫폼입니다. [ 더 알아보기 ] 💡 크로스 플랫폼(Cross Platform)이란? - 여러 플랫폼에서 동작하는 애플리케이션 개발 방법을 의미합니다. 하나의 코드로 여러 플랫폼에 대응할 수 있으며, 개발 비..

해당 글의 목적은 Git에 대한 이해를 하고 Git을 이용하는 방법에 대해서 익힙니다. 그리고 주요한 용어에 대해서 익히는 것을 목표로 하고 있습니다. 1) Git Git은 파일에 대한 변경사항을 추적하여 여러 명의 사용자들 간에 해당 파일들을 조율하기 위한 분산 버전 관리 시스템을 의미한다. 사용자는 원격 저장소에서 변경 사항에 대한 동작들을 수행한다. 분산 버전 관리 시스템 - Server Computer와 개인이 각각 가지고 는 Computer A, Computer B가 존재한다. - ’Server Computer’에서는 원격 저장소(Remote Repository) 공간을 가지고 있는다. 이와 연결하여 Computer A, B가 연결되었다. - Computer A, B는 각각 로컬에서 개발을 진행..

해당 글은 자바스크립트 라이브러리 'Prettier'에 대해서 이해하고 환경설정을 하기 위한 목적으로 작성된 글입니다. 1) Prettier 이해하기 💡 Prettier는 코드를 읽어 들여서 사용자가 지정한 '옵션'에 따라 코드를 다시 포맷팅(정렬)하는 "코드 포맷터"입니다. 코드 스타일에 초점을 맞추고 있기 때문에, 코드 품질을 위해 사용하는 ESLint와는 성격이 다릅니다 Prettier 지원 언어들 * JavaScript (including experimental features) * JSX * Angular * Vue * Flow * TypeScript * CSS, Less, and SCSS * HTML * JSON * GraphQL * Markdown, including GFM and MDX *..

Git을 관리하는 방법 중 Git CLI(Command Line Inteface)를 통해서 사용되는 명령어에 대해서 알고 이해합니다. 해당 글은 Command 명령어가 무엇이 있고 언제 사용하는지에 대한 설명 글입니다.      1) Git 환경 설정 관련 CLI💡 Git에서 환경에서 사용하는 CLI 명령어분류명령어설명configgit config --list- 모든 Git 설정에 대해 조회합니다.statusgit status- 작업 디렉토리와 스테이징 영역의 현재 상태를 보여줍니다.loggit log- 커밋 기록을 표시합니다.loggit log -n [숫자]- 최신 [숫자]개의 커밋을 커밋 기록에서 보여줍니다.touchtouch .gitignore- 새로운 .gitignore 파일을 생성합니다.   ..

Visual Studio Code 툴을 사용하는 중에 편집 중인 파일들이 한 곳에 보이지 않는 상황이 발생하였습니다. 이럴 때 해결할 수 있는 방법에 대해서 공유하며, 역으로 사용 중인 파일 단 하나만 보고 싶을 때 해결할 수 있는 방법 이기도 합니다. 1) 현재 작업 중인 파일 한 개만 보이는 경우가 발생하였습니다. 2) 해결방법 💡 사용자 별로 VSCode의 키보드 키를 다르게 사용하여서 해당 변경이 되는 키를 확인합니다. 1. Code 탭 - 'Preferences' - 'Keyboard Shortcuts'을 누릅니다. 2. ‘Keyborad Shortcuts’ 창이 뜨게 되고 ‘Toggle tab visibility’를 검색하여서, 키보드 키를 확인하고 해당 키를 눌러줍니다 💡 저는 아래의 키와 ..

Visual Studio Code 툴을 이용하고 있는 중에 README.md 파일을 수정 할 일이 있다면 좀 더 가시적으로 볼 수 있는 방법에 대해서 소소한 꿀팁 드립니다. 1. [VSCode] Visual Studio Code를 실행합니다 2. [VSCode] README.md 파일을 연 상태에서 '파일 검색' 단축키를 누릅니다 - Window OS: Ctrl + P - MacOS : Command + Shift + R Go(이동)탭 - Go to file...(파일로 이동...) 메뉴를 이용하여도 가능합니다. 3. 검색어에 '>' 를 입력하면, 'Markdown: Open Preview'가 보입니다. 이를 선택합니다. 4. 해당 미리보기 README.md 파일이 보이고, 기존 README.md 파일과..

해당 글의 목적은 Repository에서 소스 작업 이후 Commit & Push를 하는 경우에 특정 ‘파일’ 및 ‘경로’를 제외하여 해당 작업을 진행하고자 할때, gitignore 파일을 사용합니다.이에 대해 .gitignore에 대한 정의와 구성 방법에 대해서 익히기 위한 목적의 글 입니다. STEP1: .gitignore 이해하기 1. .gitignore 정의 해당 프로젝트 내에서 불 필요하다고 느끼는 특정 '파일' 및 '디렉토리 경로'에 대해서 Repository에 올리지 않기 위해서 이 파일들을 무시(ignore)하기 위한 정보를 가지고 있는 파일(.gitignore)을 의미 합니다 2. .gitignore에 포함되는 정보 용량이 커서 제외 되어야 할 파일 혹은 디렉토리 경로 Ex) npm / ..

웹 상에 캔버스를 통해서 그림, 도형들을 그리는 동작들을 해주는 KonvaJS를 이해하기 위한 목적이며, 해당 작성글은 초기 구조 이해와 용어에 대해 익히기 위한 목적임. 1) KonvaJS 구조 이해 1. KonvaJS 정의 💡 Konva는 HTML5 2D Context를 확장한 Canvas JavaScript framework입니다. Konva는 또한 애니메이션, 전환, 노드 중첩, 계층화, 필터링, 캐싱, 데스크톱 및 모바일 애플리케이션에 대한 이벤트 처리 등을 제공해줍니다 2. Konva 구조 💡Stage, Layer, Group, Shape는 HTML 페이지 내의 가상의 DOM 노드로 구성이 되어서 화면상에 그려집니다. 💡 대략적인 구조는 Stage안에 각각에 Layer를 가지고, 그 안에 Gr..

해당 글의 목적은 Github 소스 중에서 일정 Tag를 만들어서 코드 프리징(=Code Freezing)을 하여 추후 소스 배포를 위한 Releases 버전을 구성하는 방법이며, 해당 작성글은 이를 위한 환경설정 부분입니다. 💡 코드 프리징(Code Freezing) - 소스 코드를 더 이상 개발하거나 수정하지 않는 단계를 의미한다. - 대부분 다음 버전의 배포를 위하여 코드 프리징을 하는 경우가 많습니다. 1. 태그(Tag) 생성하기 해당 필자는 ‘Sourcetree’ 툴을 이용하여서 태그를 생성하는 방식을 서술합니다. 1. [Sourcetree] 태그를 만들려는 구간을 확인합니다 2. [Sourcetree] 해당 구간에서 오른쪽 마우스 키를 누른 뒤, ‘태그...’ 버튼을 누릅니다. 3. [Sour..

해당 글의 목적은 배열에 대한 반복문으로써 필요한 데이터에 대해 도출해 내는 함수에 대해서 공부하는 목적으로 작성하였습니다. 루프와 반복 함수 요약본 함수 설명 함수 반환값 반복문 return 값 추가 시점 for 배열내에서 객체를 반환받기 위해서 순회를 하는 함수이다. undefined 속성(key), 속성값(value) 반환 ES5 이전 for/in 배열내에서 객체값을 반환받기 위해서 순회를 하는 함수이다. undefined 속성값(value) 반환 ES5 이전 for/of 배열내에서 객체를 반환받기 위해서 순회를 하는 함수이다. (배열 뿐만 아니라 이터러블한 객체를 모두 순회할 수 있음) undefined 속성(key), 속성값(value) 반환 ES6 forEach 배열내에서 객체를 반환받기 위해..