study (70) 썸네일형 리스트형 [웹개발 100일] Day 52~55 - 프로필 마우스오버 조회 팝오버 기능 작업 시간: 2시간 남의 프로필 간단 조회 팝오버를 만들었어엽 !!!!!클릭하면 다른 사람 바이오를 구경할 수 있도록 바이오 페이지도 구현 예정입니다. 조회 가능하도록 할 데이터 목록- 프로필 사진- 유저네임- 바이오- 오늘의 무드, 요즘 최애 음악, 최근 접속일- 생일- 작성한 글 목록- 참여한 이벤트 목록 shadcn UI의 Tooltip 사용했어요!!import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger,} from "@/components/ui/tooltip";type User = { id: number; username: string; profileImageUrl: string;};interface ProfilePopo.. [토플 D-81] ChatGPT가 내주는 Writing 문제 풀어보기 2 지피티랑 같이 라이팅 문제를 몇 개 더 풀어봤어요.기본 글쓰기 구조 같은 건 어렵지 않은데 뭔가 최고득점을 위한 한끗 뉘앙스 살리기가 너무 어려움..영어스럽게 생각해야 하는데 자꾸 한국어>영어로 번역해서 쓰려고 하는 듯.문장 단위 암기밖에는 방법이 없다 이건 ㅠㅠ 예시문제 3 - Independent Writing Do you agree or disagree with the following statement?People should sometimes do things that they do not enjoy.Use specific reasons and examples to support your answer. 내 답변I agree with the statement which says people .. [토플 D-82] ChatGPT가 내주는 Writing 문제 풀어보기 드.디.어. 토플 공부란 것을 시작했구요.지피티한테 라이팅 문제 몇 개 내달라고 시켜서 풀어보았읍니다. 예시문제 1 - Independent Writing "Some people prefer to focus on one project at a time, while others like to handle multiple tasks at once.Which do you prefer and why?" 내 답변I prefer to handle multiple tasks at once. The biggest reason of it is that it is simply not possible to do only one thing at once. My brain is like a theme park, alway.. [웹개발 100일] Day 50~51 - 게시글 업로드 페이지 UI 구현 (shadcn 사용) 게시글 업로드 페이지를 리뉴얼 했습니당.아직 에디터는 안 넣었어요.shadcn을 써보고 싶어서 새로 설치하고 적용해봤어요. 🚀 요약작업 시간: 2시간✅ 게시글 업로드 페이지 UI 구현🚀 게시글 업로드 페이지 UI 구현 import { Button } from "@/components/ui/button";import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue,} from "@/components/ui/select";import { ParticipantMultiSelect } from "@/components/MultiSelect";import { DateRangePicker } from "@/components/Dat.. [웹개발 100일] Day 47~49 - 게시글 업로드 페이지 UI 구현 (진행중) 이제 이미지 업로드가 가능하니 게시글 작성 기능을 구현할 차례겠지요.일단 오늘은 너무 대충 만들어놓은 UI를 좀 손봤습니다.본문 작성란은 에디터 라이브러리를 가져다 쓸 듯한데 Tiptap을 고려하고 있어요. 🚀 요약작업 시간: 3시간✅ 게시글 업로드 페이지 UI 구현 (진행중) 🚀 게시글 업로드 페이지 UI 구현 (진행중) 아직 미완입니당카테고리, 참석자, 모임 날짜를 정할 수 있게 하고 발행 버튼을 추가할 거예요. 일단 지금까지 구현한 거라도 놓고 갑니다.import { useRef, useState } from "react";const EventUpload = () => { const [content, setContent] = useState(""); const textareaRef =.. [웹개발 100일] Day 45~46 - 클라이언트의 이미지 업로드 요청 처리해서 Cloudinary 라이브러리에 저장하기 프로필 사진 변경 기능을 위해 클라이언트~클라우디너리 라이브러리까지 이미지를 보내는 로직을 구현해봤어요. 🚀 요약작업 시간: 3시간✅ 프로필 사진 변경 기능 구현 🚀 프로필 사진 변경 기능 구현 로직 흐름은 이렇습니다. 1. 사용자가 파일 선택2. 임시 url을 만들어 preview 보여줌3. 사용자가 저장 버튼 클릭 시 이미지를 Cloudinary에 업로드4. 업로드 후 반환된 url을 DB에 업데이트 사용자가 파일을 선택할 때마다 바로바로 클라우드에 업로드 하면 최종 선택한 이미지를 제외하고 모두 올펀 에셋 (orphan essets)이 됩니다. 때문에 저장 버튼 클릭 이후에 클라우드로 전송하는 게 데이터 관리 측면에서 효율적일 수 있겠죠. 프로필 이미지 프리뷰를 보여주는 컴포넌트imp.. [웹개발 100일] Day 44 - 클라우드 이미지 업로드 서비스 Cloudinary 사용하기 이제 게시물 작성 & 프로필 사진 변경을 위해 이미지 업로드 기능을 만들 차례가 온 듯하다.최대한 유지비용을 줄이고 싶어서 초기에 저렴하게, 또는 무료로 이용할 수 있는 서비스를 찾아봤다. 지피티가 정리해줬고 이 중에서 Cloudinary를 사용하기로 했다.이미지 최적화 처리를 제공하고 초기 10GB까지 무료로 이용할 수 있다는 점에서 선택했다! 🚀 요약작업 시간: 2시간반✅ Cloudinary 가입하고 샘플이미지 띄워보기✅ 프로필 사진 변경 기능 구현 (진행중) 🚀 Cloudinary 가입하고 샘플이미지 띄워보기 클라우디너리 가입하고 Getting Started 페이지 읽어보기 npm i @cloudinary/url-gen @cloudinary/reactSDK 설치 import React f.. 여러분 그간 여러분?그간 소원했습니다? 일주일간 안 보인 사이 뭘 했냐.. 주식 했습니다 그냥 어느날 아침 갑자기음.주식에 도전해봐야겠다!하고 급발진으로 시작해 열흘 정도 단타 연습을 해보았는데요10만원 넘게 번 날도 훅훅 잃은 날도 있었고 결국 플마제로 정도의 결과를 얻었습니다. 나름 재밌는 경험이었구요초보가 본전 정도면 잘했다고 생각합니다일단 계획대로라면 이번주 금요일까지 하고 그만둘 생각입니다.직장 다니면서 재테크 공부를 너무 안 해서 솔직히 좀 걱정이었는데한 번 손대본 경험으로 만족하고요 그만두는 이유는1. 원래 일주일만 하려고 했음2. 시간과 노력이 많이 들어서 다른 걸 할 수가 없음3. 그냥 근로소득이 더 보람참이상으로 차라리 능력과 경험을 키워 근로소득으로 받는 돈을 높이는 게 더 저에게.. 이전 1 2 3 4 ··· 9 다음