[App 개발] 채팅앱 개발일지
·
Project01 [Chat App]
🐰: 채팅앱을 개발하기 위한 기획부터진행하고 있다!기획이 전공인데도 아직도 기획은 토나온다..이 게시글은 기획이 추가될때 마다 업데이트를 하기로!  TOOL : FIGMA  2024.07.16혼자서 기획, 디자인, 개발까지 하려니까 공부할게 한두개가 아니다,,!채팅기능을 구현해보려는거 만으로도 차지만..이렇게 시작한거 끝까지 해봐야지 ! 프론트엔드: Next.js, Typescript, socket.io 백엔드: MongoDB  2024.08.16정확하게 한달만에 중간 점검을 해보았는데.. 내가 너무 쉬운 방법을 택했다가 오히려 돌아가는 기분이 들었다.나는 유투브에 올라온 과정에 맞춰 언어를 선택했고, tool을 선택했다.그러다 보니까 동영상 업로드가 끊기면 나의 개발도 거기서 끊기길 4번을 반복하고 ..
[App 개발] 채팅앱 개발하기 - 개요
·
Project01 [Chat App]
🐰: 회사에서 가장 큰 프로젝트였던React Native 앱을 드디어 오픈했다🎉개발할때는 힘들어 죽겠고, 언제 끝나나 했는데오픈하니까 정말 뿌듯다..✌🏻 그래서 회사에서 또 다른 큰 프로젝트를 기획중이라그 기획이 끝나기 전까지 개발팀은각자의 프로젝트를 작은 규모로 '기획-개발'해보기로 했다. 나는 무엇을 개발할까 고민하다가 채팅앱을 구현해보기로 했다 ! 가장 큰 목표는 채팅 기능...!  사용할 언어는 프론트엔드는 Next.js, Typescript를 사용하고,Next.js: React를 기반으로 한 언어로 백엔드까지 이해할 수 있는 언어라 선택.Typescript: 회사 프로젝트에서 처음 사용해봤는데 굉장히 매력적으로 느껴져 선택. 백엔드는 아직 미정이다! 채팅앱을 개발하는 과정을 하나씩 남겨 보..
[RN] react-native UseEffect (()=> {},[]); 사용법
·
React Native
🐰: react-native를 사용하면서 정말 많이 사용한게 UseEffect 인거 같다.그래서 개념부터 꼼꼼히 알아두는게 좋을거 같다😎  UseEffect 란?사이드 이펙트(side effects)를 수행하기 위한 훅으로, 데이터 가져오기, 구독설정하기, 수동으로 React 컴포넌트의 DOM을 수정하는 작업 등을 수행할때 유용하다. 1. useEffect 기본 사용법useEffect(() => {    // Side effects를 수행하세요.        return () => {        // cleanup 로직이 필요한 경우 여기에 작성합니다.    };}, [/* 의존성 배열 */]); Side Effect 부분에 useEffect 동작 시 실행할 로직을 추가한다.그리고 의존성 배열 의 ..
[RN] react-native 댓글태그 지우기, Comments Tag remove, Back Space
·
React Native
🐰: 이미 기존에 구현되어있던 태그 취소 방법은태그 부분을 한번 더 눌러주면 태그가 삭제되는 방법이였다. 그런데 여기다 Back Space버튼으로도태그가 삭제되게 해달라는 요청을 받았다..🤪 퇴사한 사람의 코드를 이어서 하면서코드를 처음부터 하나씩 뜯어 보고 의도를 파악하는게아직 나에게는 너무 벅차다...🤣하지만...! 항상 방법은 찾으면 있다는거 ~ //키패드 버튼으로 태그 지우기const removeTag = (event) => {if (event.nativeEvent.key === 'Backspace' && comment === '') { onResetReply && onResetReply();}}; {((replyItem?.userName || editTarget..
[RN] react-native Pull Down refresh
·
React Native
🐰: Appl App 심사를 위해서는 '차단'기능 필수 더라구요.3번의 리젝 후 백엔드 프로님과 후다닥 차단 기능을 추가했어요🙈오늘 포스팅할 기능은앱에서 화면을 아래로 당겨서 새로고침 하는 방법입니다.  import styled from '@emotion/native';import { useQuery } from '@tanstack/react-query';import React, { useCallback, useRef, useState } from 'react';import { RefreshControl } from 'react-native';import { Container, ContentBox, Row} from '../../config/globalStyles';import { BoldTex..
[RN] react-native 'Attempt to invoke virtual method ~' error (Android)
·
React Native
🐰: 아직도 원인모를 error가 나타나면 눈물이 앞을 가린다 ..iOS에서는 잘만되던 부분인데, Android에서만 error가 뜬다. 위 와 같은 에러는이 오류 메시지는 주로 안드로이드 앱 개발 중에 발생합니다. 이것은 객체가 null인 상태에서 해당 객체의 메소드를 호출하려고 시도할 때 발생하는 오류입니다. 구체적으로 말하면, null로 초기화되지 않은 Path 객체에서 isEmpty() 메소드를 호출하려고 시도한 것입니다. 라고 Caht gpt가 설명해주었다..🤓아무리 찾아봐도 코드에서 어느 부분에서 이러한 오류가 뜨는건지 알 수 없었다 ..그래서 에러가 뜨는 파일에서 null을 검색해 봤더니  두둥..! Col컴포넌트에 준 style에서 null을 사용해서 뜨는 에러였다..!null을 0으로..