본문 바로가기

전체 글

내일 배움 캠프 23_08_23 TIL 오늘도 어제에 이어서 ImageTag를 찍고 저장하는 부분을 더 해보았는데 오늘은 더는 이 기능에 대한 공부에 매몰되면 안될 것 같아서 우선 지금 프로젝트 코드에 합쳐보았다 import React, { useState } from 'react'; import { uniqueId } from 'lodash'; import { Tag, ImageData, Data } from 'src/types/types'; import supabase from 'src/lib/supabaseClient'; import { ImageTagProps } from 'src/types/types'; const ImageTag: React.FC = ({ onTagsAndResultsChange }) => { const [selec.. 더보기
내일 배움 캠프 23_08_22 TIL 오늘은 데이터 테이블이 수정이 되면서 기존에 짯었던 코드를 조금 수정했는데 import React, { useEffect, useState } from 'react'; import { useAtom } from 'jotai'; import { Post } from 'src/types/types'; import { RealTimeContainer, PostContainer, PostCard, Title, Body, Image, ImageWrapper, HeadTitle, Rank } from '../StyledSideBar'; import { likesAtom, postsAtom } from '../FetchPosts'; const RealTimeCombo = () => { // Jotai의 useAtom.. 더보기
내일 배움 캠프 23_08_21 TIL 최종 프로젝트에서 크롤링을 끝마치고 사이드 쪽에 여러가지 인기있는 조합이나 최신순 리뷰글을 필터링해서 보여주는 부분을 우선 구도를 잡고 데이터를 패치해온 부분까지 끝내놓고 팀원들과 공유하는 DB가 완성이 된다면 데이터를 받는 부분을 바꿔끼워주면 우선은 완성되기에 그 부분을 해놓고 오늘은 글을 작성시에 이미지에 태그를 넣기위한 방식을 공부해보았다. 이번 최종 프로젝트에서 원하는 정확한 기능으로는 아직 완벽히 짜지 못했지만 입력내용을 입력하고 클릭시에 태그를 넣는데 까지는 성공을 하였다. import React, { useState } from "react"; import { Tag, ImageData } from "./types/Types"; import { supabase } from "./supabas.. 더보기
내일 배움 캠프 23_08_18 TIL 어제 웹페이지 크롤링을 통해서 편의점의 데이터들을 가져오는 것을 했었는데 거기서 생긴 사항이 있었어서 그거에 대한 TIL을 작성하려한다 const express = require("express"); const puppeteer = require("puppeteer"); const cors = require("cors"); const app = express(); const port = 3001; app.use(cors()); app.get("/data", async (req, res) => { try { const browser = await puppeteer.launch(); const page = await browser.newPage(); await page.goto( // "https://cu... 더보기
내일 배움 캠프 23_08_17 TIL 오늘은 데이터 크롤링을 위해서 express로 간단한 서버를 만들고 그 서버를 통해서 데이터를 크롤링해오고 그 데이터를 클라이언트에서 요청해서 받아온 후 DB에 저장하는 로직을 구현해보았다 const axios = require("axios"); const cheerio = require("cheerio"); const log = console.log; const getHtml = async () => { try { return await axios.get( // "https://cu.bgfretail.com/product/view.do?category=product&gdIdx=17686" "https://cu.bgfretail.com/product/product.do?category=product&de.. 더보기
1조 KPT 회고 1조 : 1 생활관 1. 한 주의 흐름 1) 한 일 프로젝트 명: EGI (Electro Get IT) 필수 작업: 로그인/회원가입, 소셜 로그인, 비밀번호 찾기, 카테고리 별 필터링, 게시글 CRUD, 이미지 슬라이더 구현, 페이지네이션 구현, 댓글 CRUD, 대댓글 CRUD, 프로필 수정, 내가 쓴 글목록, 찜한 제품 목록, 추가 작업: 판매 완료 기능, 결제 모듈API, 작성 시간 계산, 소셜 공유 2) 느낀점 유길 - 실력에 비해서 새로운 기술에 대한 욕심만 많아서 엄청 짧은기간인데 구현하느라 다들 어렵고 힘드셨을텐데 이러한 부분에 있어서 팀장으로서 잘못됐다고 생각하고 조금 더 신경을 써야겠다고 느꼈고 언제나 느끼는 코드를 간결하게 작성하지 못해서 팀원들이 어려웠을것을 생각하니 클린 코드 및 SO.. 더보기
내일 배움 캠프 23_08_10 TIL 오늘은 슬라이더를 구현하기위한 캐러셀과 yarn add react-responsive-carousel 로 설치를 해준 후 import { Carousel } from 'react-responsive-carousel'; import 'react-responsive-carousel/lib/styles/carousel.min.css'; 이렇게 두개를 임포트해주고 {post.image_urls.map((imageUrl, index) => ( ))} 이런식으로 이미지를 불러오는 곳을 감싸주기만하면 끝 물론 이렇다면 슬라이드바가 너무 안보인다 되도록이면 슬라이드 바는 커스텀해서 사용하는게 좋을 듯 하다 더보기
내일 배움 캠프 23_08_08 TIL 오늘 이제 supabase 를 사용해서 db에 저장을하고 이미지파일을 올리면 storage에 저장을하고 이 데이터들을 바탕으로 포스트를 뿌려주는 것을 구현했다 또한 파일을 여러개 올릴 수 있는 방법 중 하나인 multiple을 알게되었다 더보기

티스토리툴바