SchedAI 개발기 ep 3. 시작되는 난관

역시 아직 AI로 코딩하는 것은 참 어렵다.

저번에 만든 개발 기획을 참고해서 코드를 하나씩 생성해달라고 했다. 그런데 UI에서 원하는 결과가 안나왔다.

자주쓰던 daisyUI를 버리고 글래스모피즘으로 커스텀 UI를 만들어보려고 했는데 AI는 그냥 단순하게 블러 몇개 넣고 끝이였다.

컴포넌트 형식으로 만들어 달라고하자, 그제서야 glasscontainer나 button같은 컴포넌트를 만들기 시작했다. 하지만 ai가 예술적인 부분에서 많이 부족했다.

몇번 삽질하다가 결국 대체제를 찾았다. nextui를 쓰기로 바꿨다.

nextui를 쓰니 모든것이 편해졌다. 일단 backend먼저 구현하고 개발되어있는 nextui에 내가 간단하게 글래스 모피즘 느낌만 추가해주면 좋을것 같다.

챗피티에게 글래스 모피즘 얘기를 많이 했으니 아마 개발되면서 조금씩 적용될 거 같긴하다.

다크테마는 원래부터 next-theme으로 할 예정이였다. nextui로 바꾸면서 이것도 바꿔야하나? 걱정이 되었지만 다행이도 nextui에서도 next-theme으로 개발하는 도큐먼트가 작성되어있었다. 이건 코드를 작성하는 것 보단 파일구조를 생성하는게 좀 있어서

(app/provider.tsx 생성하고, 감싸는 형식.)

사실상 AI가 코드짠건 없다 ㅋㅋ

https://nextui.org/

NextUI - Beautiful, fast and modern React UI Library

 

첫번째로 ui와 기본적인 auth작업에 들어갔다. 이건 다른프로젝트하면서 만났던 문제들이 똑같이 나와서 비교적 해결하기 쉬웠다.

chatgpt는 auth코드써달라고 하면 대부분 Nextauth v4코드로 써준다. 나는 auth v5를 쓰고싶었기에 공홈에서 코드를 복사해서 chatgpt에게 예시코드로 많이 보여주었다.

Auth.js | Authentication for the Web

 

 

npm install next-auth@beta

env도 따로 불러올 필요없이 루트 프로젝트에 auth.ts만 넣으면 되니 편하다.

# auth.ts

import NextAuth from "next-auth";
import GitHub from "next-auth/providers/github";
import Google from "next-auth/providers/google";
import { PrismaAdapter } from "@auth/prisma-adapter";
import { prisma } from "@/lib/prisma";

export const { auth, handlers, signIn, signOut } = NextAuth({
  adapter: PrismaAdapter(prisma),
  providers: [GitHub, Google],
});

이렇게 간단하게 구성했다. 사실 깃허브 로그인도 그다지 필요없...

지금은 별로 어렵게 코드 짤건 없고, 나중에 캘린더 연동할때 고생할거 같다.

 

 

 

 

가장 시간 많이 쓴 오류 : 시스템 환경변수 다루기

예전에 한번 코딩고수 갓갓 코드깎는노인 선생님이 만드신 AIEXE를 잠깐 설치했다 삭제한적이 있었는데, 그걸 깜박잊고 있었다.

.env.local이 로드가 안되서 계속 다른 apikey가 뜨고 원인을 못찾아서 계속 해맸다.

env도 바꿔보고 dotenv도 설치해보고, AIsdk까지 설치해서 계속 삽질하다가 env 명령어를 통해

시스템 환경변수에 OPENAI_API가 포함되어있었다는 것을 알게되었다.

처음에 챗지피티가 언셋하면 된다고 해서 했는데

unset OPENAI_API_KEY

이상하게 지워지지가 않았다. 그래서 구글링한결과

nano ~/.zshrc 

이 명령어를 통해 파일을 직접열어서 삭제했다.

아주 예전에 설치했던 flutter도 있다 ㅋㅋ

완전히 삭제된줄 알았는데, 똑같은 오류가 또 발생했다. 아래경로에 zsh를 초기화하는 환경변수 파일이 또 존재했던것이다

nano /Users/**/.cursor/extensions/ms-python.python-2024.12.3-darwin-arm64/python_files/deactivate/zsh/envVars.txt

 

역경을 뚫고 성공한 결과!