본문 바로가기

더이상 하지 않는 망한 프로젝트20

[앱삼] 11. (backend) 제품 데이터와 스펙 추가 및 보내주기 1. 제품 데이터 몽구스 스키마 정의하기 models/Product.js 2. 제품 리스트 데이터 따로 보관하기 models/ProductList.js 3. add 로직 controllers/product.js 4. 쿼리스트링을 이용한 다양한 상황의 데이터 요청 엔드포인트 설정하기 /controllers/product.js 5. postMan을 이용한 API 요청 Test 테스트 데이터가 잘 온다요! 엥 근데 생각해보니 jwt기반 admin 보안절차를 안거쳤다? 추가하지뭐.. 2023. 3. 26.
[리액트네이티브] 자주 사용되는 Hooks 정리 리액트네이티브(React Native)는 React의 모바일 프레임워크로, 하나의 코드베이스로 iOS와 Android 애플리케이션을 만들 수 있습니다. 이 글에서는 리액트네이티브에서 자주 사용되는 훅(hook)들과 언제 사용하는지에 대해 알아보겠습니다. useState useState는 컴포넌트에서 상태를 관리할 수 있는 기본적인 훅입니다. 상태가 변경될 때마다 컴포넌트가 리렌더링되므로 동적인 데이터를 관리할 때 유용합니다. import React, { useState } from 'react'; import { View, Text, TouchableOpacity } from 'react-native'; const Counter = () => { const [count, setCount] = useSta.. 2023. 3. 21.
[리액트 네이티브] 세팅지옥에서 드디어 돌아왔다. 1. 세팅 핵심은 brew - ruby버전 - 환경변수세팅 - cocoaPods 설치 - pod install 2. 세팅 이후 작업은 xCode -> ios폴더 열기 -> Simulator 가상머신 세팅 -> run 누르기 3. 코드 작업은 vsCode로 따로 열어서 저장하면 알아서 업데이트 된다. 4. 문제는 flutter sdk 설치로 인해 꼬였던 점이 문제였었고, 환경변수를 모두 지워야했다. 5. 결론적으로 mac 을 모두 재설치해서 처음부터 세팅하니 성공 2023. 3. 20.
[리액트 네이티브] zsh: command not found: brew 해결 1. 설치하기 /bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)" 만약 Homebrew가 이미 설치되어 있지만 여전히 문제가 발생한다면, 시스템의 PATH에 Homebrew 경로를 추가해야 합니다. 일반적으로 Homebrew는 /usr/local/bin 또는 /opt/homebrew/bin 경로에 설치됩니다. 이 경로 중 하나를 시스템의 PATH에 추가해야 합니다. 2. ~/.zshrc 파일을 열거나 존재하지 않으면 생성하세요: open -e ~/.zshrc 3. 파일의 맨 아래에 다음 두 줄을 추가하세요 (Homebrew가 설치된 경로에 맞게 변경해야 할 수도 있습니다): export.. 2023. 3. 20.
[리액트 네이티브] 커스텀 컴포넌트 만들기와 활용 안녕하세요 여러분! 이번 포스팅에서는 리액트 네이티브에서 커스텀 컴포넌트를 만들어 사용하는 방법에 대해 알아보겠습니다. 리액트 네이티브에서 제공하는 기본 컴포넌트 외에도 사용자가 직접 만든 컴포넌트를 사용하여 애플리케이션의 디자인과 기능을 확장할 수 있습니다. 이 글에서는 간단한 예제를 통해 커스텀 컴포넌트를 만들고 사용하는 방법을 설명할 것입니다. 커스텀 컴포넌트란? 커스텀 컴포넌트는 개발자가 직접 만든 재사용 가능한 리액트 네이티브 컴포넌트입니다. 기본적으로 제공되는 컴포넌트만으로는 충분하지 않거나 특정한 기능이 필요한 경우에 커스텀 컴포넌트를 만들어 사용할 수 있습니다. 커스텀 컴포넌트를 사용하면 코드의 재사용성을 높일 수 있으며, 애플리케이션의 구조와 디자인을 효율적으로 관리할 수 있습니다. 간단.. 2023. 3. 20.
[리액트 네이티브] 컴포넌트 소개와 활용 방법 안녕하세요 여러분! 오늘은 모바일 애플리케이션 개발에 인기를 끌고 있는 리액트 네이티브(React Native)의 컴포넌트에 대해 알아보려고 합니다. 이 글에서는 리액트 네이티브의 주요 컴포넌트들을 소개하고, 각 컴포넌트를 사용하여 간단한 예제를 구현하는 방법을 설명할 것입니다. 리액트 네이티브란? 리액트 네이티브는 페이스북에서 개발한 오픈 소스 모바일 애플리케이션 개발 프레임워크입니다. 리액트 네이티브는 리액트(React)의 개념을 기반으로 하며, iOS와 Android 플랫폼에서 공통적으로 사용할 수 있는 네이티브 앱을 개발할 수 있습니다. 리액트 네이티브의 주요 컴포넌트 1. View: 가장 기본적인 컨테이너 요소로, 다른 컴포넌트들을 포함할 수 있는 레이아웃 구성요소입니다. CSS Flexbox와.. 2023. 3. 20.
React Native 1장 : 걸음마 회사에서 갑작스럽게 리액트 네이티브 프로젝트에 지원투입이 확정되었다. MERN MEVN Flutter 이런 스택은 해봤는데 리액트 네이티브는 처음이다. 시간이 좀 남았으니 빠르게 익혀보고 간단한 프로젝트를 만들어봐야겠다. 자바스크립트와 리액트 기초문법에 대한 이해가 없다면 앞으로 지속되는 포스팅을 따라오지 못한다. 선행학습 하고오자. 그리고 크로스플랫폼 혹은 ios 앱 개발을 고려한다면 맘편하게 그냥 Mac 사라. MacOS 환경 이외에는 빌드 자체가 안된다. 필자도 2010년부터 삼엽충이었는데 Flutter 배우고 개발하면서 애플생태계로 모든 것을 싹 다 바꿨다. 물론 만족은 못함. 삼성이 서드파티도 그렇고 기본 기능도 더 많고 자유도도 훨씬 높음. 삼성이 애플 연동성 못따라간다는 건 옛말이다. 어쨌든.. 2023. 3. 15.
[앱삼] 10. (backend) 무한스크롤 - 게시물 몇개씩 정해서 던져주기 1. 몽구스 스키마 정의하기. - 일단 게시물 하나의 스키마를 정의해준다. - 타입, 아이디, 텍스트, 좋아요 수, 좋아요를 누른사람 목록 등을 정의한다. - mongoDB에서 제공하는 자동 타임스탬프를 활용해서 생성 시간, 수정 시간을 쉽게 가져다 쓸 수 있다. - 복합 인덱스를 생성해서 mongoDB에서 제공하는 인덱싱 기능을 사용할 수 있다. 여기서는 최신 순, 좋아요가 많은 순으로 인덱싱해서 각각 4개씩 보여줄 수 있도록 구현할거다. 2. 좋아요가 많은 순으로 4개씩 보내주기 - type은 게시판 타입이다 - count는 /api/chatmain/:type/popular/:count 로 들어온 파라미터이다. - nowMyId 는 현재 나의 아이디를 가져온다 이는 수정,삭제,좋아요 버튼 등에 쓰인다.. 2023. 3. 15.