Giter Club home page Giter Club logo

airtravel999's Introduction

웹 미니 프로젝트

Airtravel

여행을 사진과 함께 기록하고 공유하는 웹 어플리케이션


프로젝트 선정 이유

여행 사진을 보려면 클라우드에 들어가서 날짜별로 찾아서 봐야하는 점에 불편함을 느꼈다. 그렇다고 유명 SNS에 내 여행 사진을 올리고 싶지는 않았다. 오직 여행을 위한 사진을 사람들과 공유하고 공감하는 공간이 있었으면 좋겠다고 생각했다. 대륙별로 여행지를 쉽게 찾아볼 수 있도록 하고싶었다.


주요 기능

  • 메인화면에는 어플에 등록된 모든 사진들을 볼 수 있음
  • 작성된 글을 대륙별로 필터링해서 찾아볼 수 있음
  • 로그인을 하면 mytour 페이지에서 내가 작성한 글을 볼 수 있음
  • mytour 페이지에서 새 글을 작성 할 수 있음
  • 게시한 글을 수정, 삭제 할 수 있음
  • 업로드된 글에 좋아요 누를 수 있음
  • 로그인 정보에 따라 좋아요 표시된 사진을 볼 수 있음

사용 기술

  • front) html, css, javascript, jquery, jinja2
  • back) python, flask, jwt
  • DB) mongoDB

개발 파트 분배 및 일정

21.11.01 - 21.11.07

  • 프론트엔드: 김도은, 신경준
  • 백엔드: 피수연, 전상혁


개발 중 마주한 문제점들

  • 만들기 전 설계를 꼼꼼하게 하지 않아 만드는 도중에 다시 회의를 하고 설계를 해야했음.
  • 마감날을 제대로 알지 못해서 제출날에 제출을 하지 못함. (아주 큰 문제점)
  • 기능 욕심으로 인한 시간 부족.
  • 작은 기능 버그보다 큰 기능 구현에 초점을 맞추고 진행했어야함.
  • Git 사용에 있어서 초기에 미숙했고, 한 파일을 동시에 수정해서 merge conflict가 자주 일어나서 git merge에 시간을 너무 많이 씀.
  • 서버사이드 렌더링에서 어려움을 느낌.
  • Ctrl + z 키를 잘못 눌러 코드를 다 날림... (^^)


airtravel999's People

Contributors

voltnuna avatar suyeonpi avatar nickmunickmu avatar silica67sdm avatar

Watchers

 avatar

airtravel999's Issues

Interaction 추가

  • Visual area 캐러셀 추가
  • Header 스크롤 이동시 블러 효과 넣기
  • Mypage footer 추가
  • Scroll 커스터마이징
  • Post 마우스 hover 효과

createPost 모달창 UI 수정

  • 위치 및 사이즈 조정
  • 여행지 select box 를 입력창으로 수정
  • 게시글 타이틀 창 추가
  • 첨부파일 뱃지 추가

첨부파일 기능 수정

첨부 가능한 이미지 1개로 제한
이미지 선택 안하고 다른 영역 선택시 빈 뱃지 생성되는 버그 수정

2차 UI 인테렉션 작업

  • Scrollbar 커스터마이징
  • ScrollTop 버튼 footer 위치에서 색상 반전
  • Header 텍스트 색상 반전

UI bugfix 1차

  1. 내용 없을 시 footer 붕뜸 수정
  2. 캘린더 위치 수정
  3. 그 외 검수

Form 검증

📌필수 입력 사항 검증

  • 아이디 입력 여부 체크
  • 비밀번호 입력 여부 체크
  • 이미지 첨부 여부 체크

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.