개발 & IT 정보

2024.05.21 - [App] - [Dart] Dart 시작하기 #1 (with. 노마드코더)[Dart] Dart 시작하기 #2 타입, 변수1. 기본 구조void main() { var name = 'j'; print(name);}main함수는 모든 dart프로그램의 entry pointdart에서 세미콜론 자동으로 달아주지 않아 꼭 삽입해야 함세미콜론 적용 안 하는 경우가 있기 때문에 직접 달아줘야 함 (cascade operator)2. 변수변수 지정의 2가지 방법 : var, not var(지정변수)관습적으로 지역변수 선언할 때는 var, class에서 선언할 때는 타입을 지정3. Dynamicdynimaic은 여러 가지 타입을 변수에 쓸 수 있음var name;dynamic name;어떤..

[Dart] Dart 시작하기 #1 (with. 노마드코더)프로젝트를 만들면서 Dart 관련 공부한 내용을 정리하고자 포스팅https://nomadcoders.co/dart-for-beginners/ Dart 시작하기 – 노마드 코더 Nomad CodersFlutter 앱 개발을 위한 Dart 배우기nomadcoders.coDart 란모든 플랫폼에서 빠른 앱을 위한 클라이언트 최적화 언어(크로스 플랫폼)Flutter 프레임워크를 사용하여 iOS, Android, 웹앱을 개발할 때 동일한 Dart 코드 사용Dart 컴파일러에 의해 javascript로 변환되어 실행Dart 컴파일러AOT 컴파일러시스템에 맞게 최적화된 바이너리를 생성하므로 컴파일에 많은 시간 소요. 최종 배포 시 사용JIT 컴파일러가상머신에..

[Mac] 스페이스 두번 누르면 콤마(,)와 마침표(.) 생성되는 것 없애기타자를 빨리 치게 되면 가끔씩 마침표가 자동으로 생성되어 불편했었다. 맥에서 기본으로 제공되는 기능인데 이것을 비활성화 하려면 키보드 설정에 들어가 해당 기능을 비활성화 해주어야 한다.먼저, 애플메뉴(사과모양)를 선택하고 시스템 설정 메뉴를 들어간다.그 다음 아래 키보드 탭에 들어가 텍스트 입력 항목 안에 있는 편집 버튼을 누른다.그럼 스페이스를 두 번 눌러 마침표 추가하는 기능이 활성화 되어있는 것을 볼 수가 있다. 버튼을 눌러 비활성화로 바꿔준다.

투두리스트 앱개발 부터 출시까지![React Native]투두리스트 앱 개발하기(1) - 개발 환경 구축(with. Expo)시작하기 앞서앱을 만들기 전 기획부터 배포까지 전반적인 앱 개발 프로세스부터 알아야 한다. 이전에 작성해두었던 앱개발 프로세스들을 복기하면서 정리해보았다.기획 → 디자인 → 개발 → 테스트 → 출시 및 배포지금 기준으로 기획과 디자인은 완성된 상태이고, 개발 배포까지 한 달안에 끝내야 함!기획과 디자인기획 디자인은 모두 figma 안에서 해결봤다. tool 사용법도 쉽고, 마인드 맵과 프로토타입을 쉽게 만들 수 있어 좋았다. figma 사용법은 유튜브에 무료 강의 영상도 있으니 찾아보는 것을 추천함.node, watchman 설치React Native를 설치하기 전에 필요한 개발..

[nvm] macOS에서 nvm 설치하기 (feat. brew)nvm: node 버전 관리 도구brew를 통해 nvm을 설치해보도록 하겠습니다.Homebrew 설치Homebrew: macOS 및 Linux 시스템에서 소프트웨어 패키지의 설치를 간편하게 해주는 오픈 소스 패키지 관리자https://brew.sh/ HomebrewThe Missing Package Manager for macOS (or Linux).brew.sh설치 명령어를 복사하여 실행합니다./bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)"brew 명령어설치된 패키지 목록 확인brew list패키지 설치brew ins..

[R3F] React에서 3D Model 보여주기React-three-fiber와 React-three-drei을 통해 3D 파일을 import하여 보여줄 것이다.1. 3D 파일 다운로드3D 파일이 없다면 아래 사이트에서 다운로드한다.https://sketchfab.com/feed Log in to your Sketchfab account sketchfab.com원하는 이미지 선택 -> gltf 파일 다운로드 클릭gltf를 받으면 bin, gltf포멧형식의 파일을 볼 수 있다 2. 프로젝트 생성CRA로 프로젝트를 생성한다npx create-react-app r3fProject3. 3D 파일 Public폴더에 추가생성된 프로젝트 Public 폴더에 3D파일을 넣는다bin파일명과 gltf buffers ur..

2024.05.12 - [frontend] - [three.js 기초 #2] Scene [three.js 기초 #2] Scene2024.05.12 - [frontend] - [three.js 기초 #1] Geometry [three.js 기초 #1] Geometry2024.05.12 - [frontend] - [three.js 기초 #0] 시작하기 & 환경 세팅 [three.js 기초 #0] 시작하기 & 환경 세팅※ 순수 자바스크립코드와 threeeunjitech.tistory.com[three.js 기초 #3] MaterialMaterial 종류공식문서: https://threejs.org/docs/index.html#api/en/materials/LineBasicMaterial three.js doc..

2024.05.12 - [frontend] - [three.js 기초 #1] Geometry [three.js 기초 #1] Geometry2024.05.12 - [frontend] - [three.js 기초 #0] 시작하기 & 환경 세팅 [three.js 기초 #0] 시작하기 & 환경 세팅※ 순수 자바스크립코드와 three 라이브러리를 사용한 기초 실습입니다. 유튜버 GIS DEVELOPER 님의 강eunjitech.tistory.com[three.js 기초 #2] Scene1. Scene이란Scene은 3D 장면을 구성하는 모든 요소들을 포함하는 컨테이너 역할을 합니다.3D 오브젝트, light, cameraScene 기본 생성 코드const scene = new THREE.Scene();Rendere..

2024.05.12 - [frontend] - [three.js 기초 #0] 시작하기 & 환경 세팅 [three.js 기초 #0] 시작하기 & 환경 세팅※ 순수 자바스크립코드와 three 라이브러리를 사용한 기초 실습입니다. 유튜버 GIS DEVELOPER 님의 강의(https://youtu.be/vjKuk5Vp93k?si=aoRRPljQ3pKDDJO8 )를 보고 정리한 내용입니다.1. Three.js 란?WebGL 위에 구eunjitech.tistory.com[three.js 기초 #1] Geometry1. Geometry란?Geometry는 메쉬, 선, 점 등의 기하학적 형태를 표현하는 데 사용되는 three 핵심 요소모든 정보 데이터들은 하나로 모여 GPU에 빠르게 전달됨2. Geometry 종류B..

※ 순수 자바스크립코드와 three 라이브러리를 사용한 기초 실습입니다. 유튜버 GIS DEVELOPER 님의 강의(https://youtu.be/vjKuk5Vp93k?si=aoRRPljQ3pKDDJO8 )를 보고 정리한 내용입니다.1. Three.js 란?WebGL 위에 구축된 고수준의 Javascript 라이브러리.3D 그래픽을 쉽게 웹 브라우저에 표시하고, 저수준의 WebGL을 직접 다룰 필요 없이 3D 장면, 모델, 카메라, 애니메이션 등을 구축할 수 있음.WebGLWeb Graphics Library 는 웹 브라우저에서 실시간 2D 및 3D 그래픽을 렌더링하기 위한 저수준의 그래픽 API.OpenGL ES의 웹 기반 버전으로, HTML5의 요소를 활용하여 GPU 가속을 통한 이미지와 애니메이션..