[사진첩] 사진첩 상세보기 (이미지 렌더링)
·
Project 댕린이집
이제 사진첩의 특정 글을 들어가면 상세보기를 할 수 있는 기능과 화면을 구현해보겠습니다. [ 전체코드 ] GalleryView.js더보기import React, { useEffect, useState } from "react";import { useParams } from "react-router-dom";import axios from "axios";import 'bootstrap/dist/css/bootstrap.min.css';import { Button, Card } from 'react-bootstrap';const GalleryView = () => { const { id } = useParams(); // URL에서 id 파라미터를 가져옴 const [imageData, setIm..
[사진첩] 사진첩 목록 조회 + 이미지 렌더링(썸네일)
·
Project 댕린이집
사진을 업로드 했으니 경로를 통해서 가져와 렌더링 해줘야겠죠? [ 전체코드 ]  GalleryController.java 더보기package com.example.demo.controller;import com.example.demo.dto.GalleryDTO;import com.example.demo.entity.GalleryEntity;import com.example.demo.service.GalleryService;import org.springframework.beans.factory.annotation.Autowired;import org.springframework.http.HttpStatus;import org.springframework.http.MediaType;import org.sp..
[사진첩] 업로드 한 파일 경로 저장
·
Project 댕린이집
정처기 실기 + 방통대 기말고사를 끝내고 컴백했습니다...물론 그동안 프로젝트를 병행하며 공부했지만, 노션에만 매일 기록해놓고 미처 블로그에는 업로드를 못했네요 😱오늘부터 노션에 기록했던 내용들을 정리하여 다시 기록해보겠습니다!  [ 전체코드 ]GalleryService.java더보기package com.example.demo.service;import com.example.demo.dto.GalleryDTO;import com.example.demo.entity.GalleryEntity;import com.example.demo.repository.GalleryRepository;import lombok.extern.log4j.Log4j2;import org.springframework.beans.f..
[사진첩] 업로드 파일(이미지) 미리보기
·
Project 댕린이집
CreateGallery.js [ 전체코드 ]더보기import React from "react";import { useState } from "react";import axios from "axios";import { useCookies } from "react-cookie";import Nav2 from "../components/Nav2";import DatePicker from "react-datepicker";import "react-datepicker/dist/react-datepicker.css";import '../css/CreateGallery.css'let CreateGallery = () => { let [cookies, setCookies, removeCookies] = useC..
[사진첩] 저장경로와 파일명 지정
·
Project 댕린이집
지난 글에서 올렸던 galleryService 중 업로드되는 파일의 저장경로와 파일명 지정하는 부분을 자세히 살펴보겠습니다. 먼저 application.properties에 업로드된 파일을 저장하는 경로를 지정해주었구요.중간에 폴더 이름에 한글이 있으면 깨지는 현상이 나타나길래 전부 영어로 설정해주었습니다.  그 후, galleryService에서 @Value 어노테이션을 사용하여 part.upload.path 속성의 값을 가져와서 uploadPath 변수에 할당합니다. 업로드할 파일들을 저장할 위치를 지정하는 속성 값을 가져오는 것 입니다. // 업로드 할 위치 @Value("${part.upload.path}") private String uploadPath;    @Service@Log4j2pub..
xoo | 수진
xoo의 성장기록