VSCode 익스텐션으로 Chat GPT 기능이 들어왔다고 한다. 간단하고 재미난 프로그램을 하나 만들고 싶었다. 뭐 만들지 생각하다가 술자리 병돌리기 프로그램을 한번 만들어보려고 한다. 버튼을 누르면 술래를 지목해주는 그런 프로그램.. ㅋㅋ VScode에 익스텐션으로 들어와있는 chat GPT 기능이 여러개가 있는데, 그 중에 easycode - chatGPT를 활용해봤다. 다운로드 수가 많았고, 로그인이 필요 없다고 해서 이걸로 골랐다. 입문자들이 사용하기 좋을 듯하다. 나는 로그인을 해서 사용하긴했는데 불편한 점은 대화 내역을 확인할 수 없다는 것.. 그리고 가끔 연결이 끊기고 질문이 밀리는 등 버그도 꽤 있었다. 점차 개선되겠지..! 바로가기 결과물 전체 코드 및 github 링크 나는 three..
TIL 22.08.29 현재 프로젝트에서 무한스크롤을 구현해야하는 기능이 있다. 홈 스크린 상단에는 배너, 검색바, 리스트 필터링하는 버튼들이 있고, 그 아래에 무한스크롤로 구현된 리스트를 렌더링 해야 한다. 지난 TIL에서 우선 FlatList와 ScrollView의 차이점부터 알아보았다. 서칭해보니 무한스크롤 기능을 위해서는 대부분 FlatList를 사용함을 알 수 있었다. 왜냐하면 FlatList의 onEndReached prop가 리스트 하단에 스크롤이 머문 것을 인식하고 그에 따른 이벤트를 불러올 수 있기 때문이다. 하지만 ScrollView에는 이러한 prop가 없다. 처음에는 홈 스크린 전체는 ScrollView로 두고, 내부 리스트를 렌더링하는 부분은 FlatList를 쓰면 되겠다고 생각했..
TIL 22.08.28 ScrollView와 FlatList의 차이점을 알아보자 ScrollView https://reactnative.dev/docs/scrollview ScrollView · React Native Component that wraps platform ScrollView while providing integration with touch locking "responder" system. reactnative.dev ScrollView renders all its react child components at once, but this has a performance downside 공식문서에 나와있다시피 ScrollView는 화면 상관없이 모든 요소를 한번에 렌더링하기 때문에 성능 ..
TIL 8/23 https://reactnavigation.org/docs/getting-started https://reactnavigation.org/docs/getting-started/ reactnavigation.org npm install @react-navigation/native npm install react-native-screens react-native-safe-area-context 공식문서에 따라 필요한 패키지와 라이브러리를 설치해준다. App.js import * as React from 'react'; import { NavigationContainer } from '@react-navigation/native'; export default function App() { re..
설치 OS : macOS Monterey 12.5 node : v16.16.0 npm : 8.11.0 watchman : 2022.08.15.00 xcode : 13.4.1 cocoapod : 1.11.3 react-native : 8.0.6 openjdk14 javac : 14.0.2 내 핸드폰 기종이 iPhone이라 Xcode를 이용하여 React Native 개발 환경 구축을 진행하였다. 더보기 [MAC M1] React Native 개발 환경 구축 및 에러 해결 Homebrew Homebrew : https://brew.sh/ Homebrew 사이트에서 설치한 후 터미널에서 위의 명령어를 통해 설치 및 버전을 확인합니다. 정상적으로 설치되었다면 다음과 같이 버전을 확인할 수 있습니다. ![](ht..
React.js 에서는 object를 수정하면 안된다. 수정하고 싶을 땐 기존 object에 요소를 추가/삭제한 새로운 object를 반환해야 한다. 객체 추가할 때 두 가지 방법으로 코드를 작성할 수 있다. key: 작성 일시, value: todo list의 할 일 인 Object를 선언하고, 요소를 추가하는 방법을 공부해보려 한다. 배열로 하는 것에 익숙한데, Object로도 연습하고 정리해보고자 한다. 1. Object Assign const newToDos = Object.assign({}, toDos, {[Date.now()]: { text, done: false }); Object.assign() - JavaScript | MDN Object.assign() 메서드는 출처 객체들의 모든 열거..
TouchableOpacity TouchableOpacity - Expo Documentation Expo is an open-source platform for making universal native apps for Android, iOS, and the web with JavaScript and React. docs.expo.dev Press Here TouchableOpacity 태그로 감싼 컴포넌트를 터치할 경우 해당 컴포넌트가 잠시 투명도를 갖게 된다. onPress 외에도 onPressIn, onPressOut, onLongPress 속성을 추가할 수 있다. activeOpacity={0.6} 투명도를 설정할 수 있다. TouchableHighlight TouchableHighlight -..
Component - 화면에 렌더링되는 것 - return () 내에 태그 형태로 작성됨 API - 운영체제와 소통 - JS 코드로 작성됨 더보기 기본 App.js 코드 import { StatusBar } from 'expo-status-bar'; import { StyleSheet, Text, View } from 'react-native'; export default function App() { return ( Hello world! ); } const styles = StyleSheet.create({ container: { flex: 1, backgroundColor: '#fff', alignItems: 'center', justifyContent: 'center', }, text : { fo..
- Total
- Today
- Yesterday
- 술자리병돌리기게임
- partyrock무료
- 생성형AI
- 코딩테스트
- mac vscode download
- ChatGPT
- genaiapp
- 파이썬
- easycode
- aws생성형ai
- mac vscode download fail
- S3배포
- partyrock생성
- 병돌리기구현
- AWSBedrock
- S3 403 forbidden
- visual studio code install
- PYTHON
- partyrock
- BOJ
- 백준
- React native 작동 원리
- partyrock앱
- 정적 웹페이지 배포
- 알고리즘
- 정적 웹사이트 배포
- awsgenai
- partyrock사용볍
- easycode chatGPT
- vscode easycode
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | 5 | 6 | 7 |
8 | 9 | 10 | 11 | 12 | 13 | 14 |
15 | 16 | 17 | 18 | 19 | 20 | 21 |
22 | 23 | 24 | 25 | 26 | 27 | 28 |
29 | 30 |