설치npm install swiper/react 예시 코드"use client";import { styled } from "@mui/material";import { Swiper, SwiperSlide } from "swiper/react";import { Pagination } from "swiper/modules";import "swiper/swiper-bundle.css";const images = [ "/img/main-banner1.png", "/img/main-banner1.png", "/img/main-banner1.png",];const Carousel = () => { return ( {images.map((src, index) => ( ..
전체 글
"use client";import { Accordion, AccordionDetails, AccordionSummary, styled, Typography } from "@mui/material";import React from "react";import ExpandMoreOutlinedIcon from "@mui/icons-material/ExpandMoreOutlined";type AccordionByCollegeType = { title : string; majors : string[];}const AccordionByCollege = ({title, majors}:AccordionByCollegeType) => { return ( } aria-contr..
해당 질문에 대한 레퍼런스 링크 URL이 DB에 있다.컴포넌트가 프롭스로 받은 URL을 통해 API Route에 OG 데이터를 추출요청을 보내고 해당 OG데이터를 통해 북마크를 생성한다.노션의 북마크 기능을 생각하면 될 듯 src / app / api / og / route.tsimport { NextRequest, NextResponse } from "next/server";export async function GET(req: NextRequest) { const { searchParams } = new URL(req.url); const url = searchParams.get("url"); if (!url) return NextResponse.json({ error: "URL is requi..
const GptAnswerAccordion = styled(Accordion)` width: 100%; border-radius: 8px; box-shadow: none !important; &::before { display: none; }`;
import { css } from '@emotion/react';// 믹스인 정의export const mixinFlex = (direction : "row" | "column") => css` display: flex; flex-direction: ${direction}; align-items: center; justify-content: center;`;const Container = styled("div")` ${mixinFlex("row")}; padding:24px; border-radius:8px;`
질문클라이언트에서는 supabase 로그인 api호출하면 수파베이스 측에서 직접 세션 정보를 로컬 스토리지에 넣어주잖아. 근데 next.15 앱라우터로 API 라우트 사용하여 백엔드 측에서 supabase 로그인 api를 호출하면 클라이언트에 세션 정보가 자동 삽입 되지 않고 리프레쉬 토큰도 적용되지 않아. 이 떄, 나의 궁금증은 아래와 같아 1. supabase는 기본적으로 백엔드 구축을 하지 않도록 설계되어 있는가?(ex) supabase를 활용하면 next.js 15의 api 앱라우터를 사용하지 않아도 되는가?) 2. supabase와 next15 api 앱라우터를 혼합해 사용하면 세션 정보 저장이나 토큰 리프레쉬는 직접 코드로 작성해야하는가 답변1. Supabase는 기본적으로 백엔드 구축을 하..
들어가며위 프로젝트는 Typescript + Next15 + styled-components + MUI 환경을 지원합니다.다만, 기존에 styled-components가 설치되신 분들은 styled 임포트 시 mui 라이브러리를 임포트하는 것에 유의 부탁드립니다. (실수 가능성이 높습니다.) 템플릿https://github.com/LDK1009/Next_Start_Template GitHub - LDK1009/Next_Start_Template: Typescript + Next15 + styled-components + MUI 프로젝트 템플릿입니다.Typescript + Next15 + styled-components + MUI 프로젝트 템플릿입니다. - LDK1009/Next_Start_Template..
Error calling OpenAI API: Error [AxiosError]: Request failed with status code 429 at async POST 필자는 위와 같은 에러 코드를 얻었다.해당 코드는 너무 많은 요청을 보낼 수 없다는 에러 메시지인데 필자는 API 요청을 처음 보내보는 상황이었다. 아래 글을 통해 결제 수단 등록 전에 API 키를 생성해 요청하기 때문에 위와 같은 오류를 발생한 것을 알게되었다.https://stackoverflow.com/questions/75041580/openai-api-giving-error-429-too-many-requests OpenAI API giving error: 429 Too Many RequestsI am trying to..