Frontend

안녕하세요~ 이전 포스트에서는 Spring Boot를 사용하여 백엔드에서 이미지 업로드 기능을 구현하는 방법을 알아보았습니다. 오늘은 프론트엔드에서 이미지를 업로드하기 위한 HTML 폼을 구현하는 방법을 살펴보겠습니다. HTML 폼 작성 이미지 업로드를 위한 HTML 폼은 다음과 같은 구성 요소를 포함합니다: 이미지 제목 입력 필드 이미지 파일 선택 필드 제출 버튼 HTML 폼 태그에는 enctype="multipart/form-data" 속성을 반드시 포함해야 합니다. 이 속성은 폼 데이터가 파일이나 이미지와 같은 바이너리 데이터를 포함할 수 있도록 지정합니다. 코드 예시 이미지 제목 이미지 파일 업로드 중요 요소 설명 이미지 제목: 사용자가 이미지에 대한 제목을 입력할 수 있는 텍스트 필드입니다.na..

안녕하세요 ~ 오랜만에 뵙습니다. 이번에 team 프로젝트로 flutter, node.js, MySQL을 사용한 애플리케이션 제작에 들어가게 됐습니다. 그래서 Flutter 공부에 들어가게 됐는데요. 오늘은 설치와 가벼운 코드 Emulator 사용까지 가보도록 하겠습니다. 개발환경은 Visual Studio Code를 사용했습니다. 한동안 intellij를 사용했어서 꽤나 검색하며 사용했습니다. 먼저 Flutter extension과 Dart extension을 다운로드 해주셔야 합니다. Dart는 C언어와 유사한 언어라고 생각하시면 됩니다. 만약 제대로 다운로드 되지않으신다면 VSCode를 재부팅해보시는 것을 추천드립니다. 이후 ctrl + shift + P 를 통해 new Project 생성을 해주시..

안녕하세요 오랜만에 인사드립니다. 요즘 리액트를 공부하면서 여러 라이브러리를 배우고 있는데요. 배우면서 여기에 공부 겸 기록하려 합니다. 시작하겠습니다. 오늘 적용한 기능은 Moment js로 시간이 사용되는 데이터 , ex 인스타그램의 "방금 전" 업로드로 표시하고 싶으시다면 이 라이브러리를 사용하면 되시겠습니다. 저는 yarn을 사용하기에 라이브러리를 설치해 줍니다. $ yarn add moment $ yarn add moment react-moment 그리고 선언을 해줍니다. import Moment from 'react-moment'; import 'moment/locale/ko'; 영어로 hour ago 를 사용하고 싶으시다면 두 번째 줄을 생략해 주시고 1시간 전으로 사용하고 싶으시다면 2번째..