FE

세감 서비스에서 Next.js14를 사용하기 때문에 Nextjs 공부를 진행하려 한다.감자 탈출기 On ... 인프런에서 이정환 님의 2024년 8월 기준으로 제작된 강의다!Next.js란?: React.js 전용 웹 개발 프레임워크(라이브러리X)로 react.js보다 더 강력하고 편하게 사용할 수 있는 기능들을 제공한다. 예를 들어, 페이지 라우팅, 빌트인 최적화 기능, 다이나믹 HTML 스트리밍 등의 기능이 추가되었다.: 리엑트에 비해 자유도는 낮지만 그만큼 웹개발에 있어 필요한 거의 모든 기능들을 제공한다. 렌더링1. JS 실행 : 자바스크립트 코드(React 컴포넌트)를 HTML로 변환하는 과정을 의미2. 화면에 렌더링 : HTML 코드를 브라우저가 화면에 그려내는 작업을 의미 사전 렌더링(Pre..

24-2학기 앱개발 프로젝트를 준비하면서, 크로스 플랫폼 앱 개발을 하기로 팀원들과 결정했다.프레임워크를 결정하기 위해 알아보던 중 하이브리드 앱 개발 프레임워크 중 Flutter와 ReactNative가 가장 많이 사용한다는 점을 알게 되었다. 우리 동아리 내에서는 플러터를 많이 사용하고 있었으나, JS에 익숙하고 React를 다뤄본 적이 있는 나로써, 비교적 빠른 시간 내에 결과물을 만들어 내야 했기에 ReactNative 프레임워크(이하 RN)를 사용하기로 결정했다.  RN은 2013년 Meta에서 출시했으며 JavaScript 기반의 오픈 소스 크로스 플랫폼 앱 개발 프레임워크로 개발자는 보다 더 짧은 개발 주기와 빠른 개발 속도로 고성능의 모바일 앱을 개발할 수 있게 되었다. 또한, JSX(Ja..

우리가 Unity 개발환경을 세팅한 방법은 다음과 같다. Step 1. 유니티 허브 설치 파일 다운로드 : https://unity.com/kr/download 해당 링크로 접속해 사용자의 OS에 맞는 유니티 HUB를 다운받는다.Step 2. 유니티 허브 설치 및 실행Step 3. 유니티 계정 생성 및 로그인Step 4. 유니티 아카이브에서 LTS(Long Term Support, 장기 지원 버전)버전 중 최신 버전 다운로드Step 5. 설치 과정 중 Visual Studio Community 2022를 함께 설치: Mac OS의 경우, Visual Studio for Mac이 2024년 08월 31일을 기점으로 사용이 중지된다. 따라서 vs 연동에 어려움이 있는 경우, visual studio code..

유니티(Unity)는 3D 및 2D 비디오 게임의 개발 환경을 제공하는 게임 엔진이자, 3D 애니메이션과 건축 시각화, 가상현실(VR) 등 인터랙티브 콘텐츠 제작을 위한 통합 제작 도구이다.또한 유니티는 윈도우, 맥OS, iOS, 안드로이드, 플레이스테이션, 엑스박스, 닌텐도 스위치, 웹브라우저(WebGL) 등 27개의 플랫폼에서 사용 가능한 콘텐츠를 만들 수 있고, 제작 도구인 유니티 에디터는 윈도우와 맥OS를 지원한다. 2016년 기준으로, 전 세계 게임엔진 시장의 45%를 차지하는 가장 인기있는 게임엔진이며, 등록 개발자 수는 5백만 명이 넘는다. 게임 개발에 사용하는 스크립트 언어는 C#와 자바스크립트(UnityScript라는 이름으로)를 지원한다. 스크립트 작성은 유니티와 함께 설치되는 비주얼 ..

React를 사용하는 데에는 많은 방법이 있지만, 여기서는 커맨드-라인 인터페이스(command-line interface; CLI) 툴인 create-react-app을 사용할 겁니다. 이 툴은 패키지를 설치하고 파일들을 생성하여 툴링들로 개발하는 과정을 신속히 처리함 create-react-app 없이 웹 사이트에 React를 추가하는 것은 HTML 파일에서 요소들을 복사해오는 것으로 가능하지만, create-react-app CLI는 React 애플리케이션을 만드는 가장 흔한 시작점임. 애플리케이션을 빌드하는 데에는 더 많은 시간이 걸리나 설정에 걸리는 시간은 줄일 수 있습니다.: 스크립트 요소 - HTML: Hypertext Markup Language | MDN" data-og-descripti..

React란 : 사용자 인터페이스(UI) 개발에 초점을 맞춘 프론트엔드 라이브러리복잡하고 동적인 웹 페이지 개발 시 사용이 용이페이스북에서 만든 Javascript_UI 라이브러리컴포넌트 기반 아키텍처를 기반으로 해 재사용성과 유지보수성을 높일 수 있도록 도와줌 React 개발 배경 : 웹 개발이 복잡해짐에 따라 html, css, js만으로는 한계가 생김 -> 초기에는 Web 개발을 위한 프론트엔드 라이브러리로 DOM조작을 쉽게해주는 jQuery 라이브러리가 주로 사용됨 (DOM은 문서 객체 모델(Document Object Model)의 약어로, 웹 페이지 문서를 트리 구조의 노드로 표현. Javascript를 사용해 이러한 노드를 조작할 수 있음. DOM은 웹 페이지의 요소에 동적으로 접근하고 수정..