본문 바로가기

전체 글

(13)
[Django] 장고 캘린더 예약 사이트 만들기 (3 - 예약 구현) 개발 순서 1. 달력 구현 (HTML, CSS, JS) 2. 날짜 선택 구현 (CSS, JS) 3. 예약 구현 (JS, DATABASE, DJANGO) config/urls.py from django.contrib import admin from django.urls import path, include urlpatterns = [ path('', include('main.urls')), path('admin/', admin.site.urls), ] config/settings """ Django settings for config project. Generated by 'django-admin startproject' using Django 3.1.3. For more information on thi..
[용어 정리] Method (메소드) 1. 작성 동기 개발을 공부하며 각종 글들을 보면 항상 메소드라는 단어가 나왔는데 이때까지 정확한 정의 없이 그냥 느낌적으로만 알고 있었다는 느낌이 들어서 이번 기회에 제대로 정의를 내리고 용어를 이해하려고 작성하게 되었다. 2. 용어 정리 Method 란 특정 기능을 정의한 코드들의 집합이다. Method는 어떠한 기능을 수행한다는 점에서 Function(함수) 와 비슷하다. 하지만 Method는 Object(객체) 내에서 정의됐거나 연관되어있는 함수들을 지칭한다. 간단히 말해 Method는 함수를 지칭하는 다른 용어라고도 생각할 수 있다. 함수 중에 Method 라는 개념이 있는것이다. 3. 예시 아래는 메소드의 예 이다 아래 코드의 testMethod 함수가 Method에 해당되는 함수이다. cla..
[REACT, JS, AXIOS] JS 다중 파일 및 JSON 전송 1. 작성 동기 [PROJECT] 동아리 모집 설문 페이지를 제작 중 지원자들의 포트폴리오 혹은 올리고 싶은 파일을 받을 수 있도록 하여야 했는데 지원자들이 작성한 글과 함께 파일들을 다중으로 받는 경우에 어떤식으로 처리를 할지 몰라 삽질을 계속해서 하다. 결국 해결을 했는데 삽질을 하다 참고한 글들을 내가 한번 더 보기 쉽게 정리를 하면 다른 사람들한테도 도움이 되고 나한테도 도움이 될 것 같아서 이 글을 작성하게 되었다. 2. Form 작성 아래는 파일을 받기 위한 간단한 예제 form 이다. import React from "react"; import axios from "axios"; const Survey = () => { return ( onSubmit(e)}> 제출 ); }; export d..
[React] Storybook 설치법 사용동기 React로 새로운 프로젝트를 진행하기 전 디자인 시스템과 효율적인 UI 개발이 해보고 싶어져서 컴포넌트 UI 개발이 가능한 Storybook을 프로젝트 파일에 적용 해보기로 했다. 1. 프로젝트 파일 준비 및 yarn 설치하기 나의 경우엔 CRA로 만들어진 프로젝트 파일이 아닌 기존에 만들어 사용하던 webpack을 이용한 프로젝트 파일이 있어서 기존 프로젝트 파일에 Storybook 패키지를 설치하여 이용하기로 했다. 아래는 기존에 내가 사용하던 React 프로젝트 파일이다. https://github.com/POBSIZ/webReact.git GitHub - POBSIZ/webReact: Webpack과 Babel, React, Typescript, Sass를 사용하는 개발환경 Webpac..
[PROJECT]
[Django] 장고 캘린더 예약 사이트 만들기 (2 - 날짜 선택 구현) 개발 동기 동아리에서 스터디나 행사 관련해서 약속을 잡을 때 매주 카톡으로 투표 및 조율을 하는 상황이 너무 피곤해서 사이트로 예약 어플을 만들면 편할 것 같아서 개발하게 되었다. 개발 순서 1. 달력 구현 (HTML, CSS, JS) 2. 날짜 선택 구현 (CSS, JS) 3. 예약 구현 (JS, DATABASE, DJANGO) [2. 날짜 선택 구현] 목표: 날짜 선택 기능을 구현 시 반드시 넣어야 했던 기능들은 아래와 같다. 1. 날짜 선택 시 그 날짜가 선택되었다는 것이 명확히 표시되어야 한다. 2. 클릭을 했을 때 예약을 위한 정보와 기능이 담긴 창을 띄워주어야 한다. 3. 한 번에 하나의 날짜만 선택이 되어야 한다. 위의 사항들을 지키며 하나씩 구현해 보았다. 개발: 처음으로 선택한 날짜의 정..
[Django] 장고 캘린더 예약 사이트 만들기 (1 - 달력구현) 개발 동기 동아리에서 스터디나 행사 관련해서 약속을 잡을때 매주 카톡으로 투표 및 조율을 하는 상황이 너무 피곤해서 사이트로 예약 어플을 만들면 편할것 같아서 개발하게 되었다. 개발 순서 1. 달력 구현 (HTML, CSS, JS) 2. 날짜 선택 구현 (CSS, JS) 3. 예약 구현 (JS, DATABASE, DJANGO) [1. 달력 구현] 참고 블로그: https://bigtop.tistory.com/68?category=827794 [JavaScript] 일반적인 달력 만들기 - 영상 자바스크립트로 간단한 달력 만들기에 이어서 일반적인 달력 만들기를 영상으로 녹화해봤습니다. 의도치 않게 오랜시간이 지나서야 이 영상을 제작하게 되었는데, 막상 시간이 지나서 제가 작 bigtop.tistory.co..
오늘의 수확(알아낸 것들) - 풍년이다 풍년 1. 데이터베이스 모델 시각화 툴 [ERD - Entity–relationship model (개체-관계 모델)] = { aquerytool.com/ AQueryTool - AQuery.Web AQueryTool은 웹 기반 ERD 툴 + SQL 자동 생성 프로그램입니다. aquerytool.com www.erdcloud.com/ ERDCloud Draw ERD with your team members. All states are shared in real time. And it's FREE. Database modeling tool. www.erdcloud.com 참고하면 좋은 글 choiseungyoun.github.io/posts/what-is-erd/ ERD란 무엇인가? - Youn's Journa..