[React Native/Expo] 소셜 로그인 사용시 expo환경에서의 주의점(Oauth2.0)
·
react-native/rutina
Rutina를 진행하면서 소셜로그인에서 좀 크게 오래 걸렸습니다. 문제 해결하는 과정을 통해서 expo환경에서 Oauth2.0 소셜 로그인 적용방식을 알아보겠습니다.1. 왜 안됨?처음에는 백엔드 개발자와 소통하며 소셜로그인을 구현해보적이 없어서 어떤 방식으로 어떻게 해야하는 전혀 알지 못했습니다. 우선 백엔드에서 처음에는 클라인언트 ID와 시크릿을 알려주었습니다. 그래서 이를 이용해서 env 파일에 적용했는데 안되었습니다. 그래서 이후에 백엔드 개발자와 소통을 하니 Ouath2.0을 이용해서 Redirect를 설정해야한다고 알려주었습니다. 2. 안전한 OAuth2 인증 방식이 문제를 해결하기 위해 OAuth2 흐름에서는 프론트엔드가 Secret을 직접 다루지 않도록 설계합니다. 가장 표준적인 Autho..
Gemma4 와 Flutter
·
AI
저번에 실패했던 React-Native에서 로컬 ai 돌리기. 그러면 다른 크로스플랫폼 언어인 Flutter는 어떨까?Flutter에서도 LiteRT-LM을 이용해서 모바일에 구동을 해주는 것은 같은데 이걸 flutter_gemma가 지원을 하고 있었습니다. 이번에는 프로그램을 만들고 나서 문제를 확인하게 되는 참사를 막기위해서 github을 바로 찾아서 들어가봤습니다만 실행이 안되는 문제는 없어 보였습니다. 그래서 flutter_gemma를 이용해서 flutter 로컬 ai를 구동을 해보려고 시도를 했습니다.말하자면 이것도 실패였습니다. flutter에서의 문제는 정확히 파악이 되지 않았습니다.오류코드를로 짐작하건데 flutter에서의 ai가 네이티브로 연동하는데에 문제가 있어서 실행이 되지 않는 것 ..
슈퍼인턴 취뽀챌2기 후기
·
정보
오늘은 간단하게 제가 참여했던 슈퍼인턴 취뽀챌 후기를 써보겠습니다! 지원동기취뽀챌은 인스타를 통해서 알게 되었는데요. 취뽀챌은 ai를 활용하면서 이력서와 포트폴리오를 분석을 해줍니다.혼자서 하는 취업준비 기간이 점점 길어지던 시기에 지금의 내 이력서와 포폴이 어느 정도이고 부족한게 무엇이지 알 수 있는 기회가 되기를 바라면서 신청을 하게 되었습니다.https://www.instagram.com/superintern.kr 좋았던점취뽀챌은 2주라는 짧은 기간이지만 꽤나 많은 과제가 존재 합니다. 이력서, 포트폴리오 수정/ 보안/ 1일 1지원 등 해야할 일들이 있고 이를 해야한다는 생각으로 하나씩 반강제? 적으로 하면서 지금 나의 위치, 부족한점을 알 수 있었고 이를 통해서 포폴, 이력서 수정 방향을 알 수 ..
앱스토어에 앱들 첫인상
·
Flutter/Diary 앱
AI 다이어리 앱을 무작정 만드는 것도 좋겠지만 실용적으로 좋은 앱을 만들어보고 싶은 생각에 시장 조사부터 하려고 합니다.앱스토어에서 AI일기를 검색했을때 상위로 나오는 앱들을 몇가지 사용해보고 장단점을 분석해보겠습니다.입력할 하루 내용은 첫번째 글에서 쓴 하루에 느낀 우울감으로 통일했습니다. 아래에는 주관적으로 정리한 것으로 기록을 위한 것 입니다.마이모리사용기 : 산에게 이야기하는 컨셉. 가장 첫번째로 나오는 앱이다. 검색을 해보면 1년만에 50만명이 사용했다고 한다. 이 앱은 다른 앱들과는 다르게 정형화된 탭바형식의 앱으로 UI가 구성되어있지 않다. 또한 일기를 쓰는 방식이 매우 간단하다. 일기처럼 긴글을 쓰지 않고 간단하게 생각나는 하루를 몇가지 단어나 짧은 문장을 말하고 "다 말함"이라는 버튼을..
AI를 이용한 다이어리(우울함 극복 방법?)
·
Flutter/Diary 앱
우울함우울함을 극복하기 위해서 AI들과 대화를 함학생때 생각했던 AI를 이용한 일기 앱이 생각남현재 배포되어있는 앱이 꽤 많음을 확인함 / AI가 발전하고 API를 이용해서 나만의 AI기능을 만들수 있겠다라는 생각을 함그렇다면 예전부터 만들어보고싶었던걸 지금해보자대신 엄청 빠르게 2주안에 완성하는 것을 목표로 해보겠음.그냥 의식에 흐름대로 가다보니 우울함 극복!을 했다는.... 하하하 뭔가 장난처럼 시작하려고 하는 앱이긴 합니다만 진짜 예전에 ai가 이정도도 아니고 딥마인드가 바둑으로 뜰때부터 생각을 막연하게나마하고 있었던 앱이긴합니다. 지금 다시 생각이 났는데 지금시기가 ai를 이용하는 앱을 개발하기에 적기인거 같아서 시도해보려고 하고 그 과정또한 정리하려고 합니다.
Gemma4 와 React-Native
·
AI
최근 구글에서 오픈소스 AI Gemma4를 공개했다. 오픈소스로 공개된 ai에 대해서 처음 알게되었는데 ,이를 활용해서 현재 react-native로 개발하고 있던 앱의 ai기능을 내장으로 구현하여 LLM api를 대채해보면 좋겠다는 생각을 하게 되었다.우선 gemma4에 대해서 알아보았다.4라는 이름에서 알 수 있는이 이번이 처음나온 것이 아니였다. 버전이 4까지 나오는 와중에 이를 몰랐다는 사실이 굉장히 뒤쳐졌구나라는 생각이 들었고 ai를 활용할 수 있는 방법에 대해서 공부를 하게 되는 계기또한 되었다.gemma4는 총 4개의 모델이 출시되었는데 여기선 숫자가 커지면 모델을 돌리기위한 자원이 많아지고 성능이 비례하여 올라간다는 정도만 알면 된다. 모바일에서 내장으로 돌리기 위해서 나온 모델로는 두가지..
📅 [04.01] 타임테이블 동적 달력 연동 & 제스처 UI 구현 (메모용)
·
react-native/rutina
기존 타임테이블 UI에 실제 시간에 기반한 동적 달력(Calendar)을 붙이고, 심미성과 편의성을 모두 잡는 제스처 상호작용(UX)을 추가함. 나중에 비슷한 기능 만들 때 바로 복붙해서 쓰려고 핵심 코드 스니펫 위주로 정리함.1. date-fns로 일주일 치 동적 날짜 배열 생성원래 ['월', '화', ...] 형태의 정적 배열이었음. 이걸 선택된 기준일(currentDate) 바탕으로 실시간 날짜에 맞춘 일주일 배열 데이터로 변환함.특히 '일요일부터 시작하는 달력'으로 맞추기 위해 startOfWeek 옵션에 weekStartsOn: 0을 줌.import { format, startOfWeek, addDays, isSameDay } from "date-fns";import { ko } from "da..
🛠️ [03.25] 타임테이블 수학적 그리드 설계 & 설정 UI 컴포넌트화
·
react-native/rutina
오늘 개발한 '달력/스와이프' 파트를 제외하고, 이전에 뼈대를 잡았던 핵심 로직 3가지(10분 단위 그리드, 실시간 타임라인, 범용 설정 컴포넌트)1. 수평 구조의 10분 단위 타임테이블 그리드 설계위아래로 늘어지는 10분 단위 대신, 세로축은 1시간(행), 가로축을 6등분(10분 칸)으로 쪼개서 한눈에 들어오게 설계함. 수학적 퍼센트 수식을 써서 어떤 복잡한 시간대의 이벤트도 완벽히 비율 계산되어 그려지게 만듦.// 행과 칸 데이터 세팅const startHour = 0; const endHour = 24; const hourHeight = 60;const hours = Array.from({ length: endHour - startHour }, (_, i) => startHour + i);const..
프로젝트 라이브러리 정리(기록용)
·
react-native/rutina
Google Antigravity를 이용해서 UI 개발에서의 효율을 높이고 데이터 관련 로직을 직접 짜면서 react-native의 구조를 공부 할 수 있도록 하기 위한 프로젝트 입니다.React-native프레임워크- expo사용 라이브러리(expo)Routing- Expo Router로컬 저장* Async Storage : 암호화가 필요없는 key-value형식의 저장 방식* expo-secure-store : 암호화가 필요한 정보를 저장할때의 암호화 저장 방식Local_Notifications- expo-notifications : Local Notifications를 사용하기 위한 라이브러리로, iOS, android사용 가능함State management- Zustand : 전역 변수를 사용하고..