/Image_Hosting_Website

이미지 공유 사이트(팀프로젝트 WEB_14)

Primary LanguageJavaScript

ImageHostingWebsite

이미지 공유 웹사이트

프로그램 실행 영상: https://youtu.be/LseAiPUReIM


참여 팀원

  • 부성준
  • 류재형
  • 조성혁
  • 오영민
  • 최영광

프로젝트 동기 및 목적

HTML, CSS, JavaScript 등의 클라이언트 인터넷프로그래밍 언어와 Node.js 서버 인터넷 프로그래밍 언어를 활용하여 이미지 공유 웹사이트를 설계하고 구현한다.


활용 기술

  • HTML
  • CSS
  • JavaScript
  • JQuery
  • Node.js
  • Express.js
  • MySQL

프로젝트 실행 방법

  1. MySQL 설치 후 'example.sql' 데이터베이스 복원
  2. Node.js 설치
  3. cmd에서 bin폴더 디렉토리로 이동
  4. 프로그램에 필요한 NPM 모듈 설치
  5. bin/lib 위치에 있는 'db.template.js'파일에서 mysql의 user, password, database 정보 입력 후 파일 제목을 'db.js'로 변경
  6. bin 폴더 내의 'main.js' 프로그램 실행

프로그램 설명

  • 메인화면(로그인 전) 메인

  • 로그인 페이지 로그인

  • 메인화면(로그인 후 - 페이지 상단의 버튼 상태 변경됨) 메인 로그인 후

  • 글 생성 페이지 글 생성

  • 글 상세 보기 localhost_3000_topic_Lorem%20ipsum%20dolor%20sit%20amet,%20consectetur%20adipiscing%20elit %20Phasellus%20ac%20rhoncus%20diam %20Aenean%20ut%20consectetur%20quam %20Morbi%20quis%20convallis%20ligula %20Etiam%20matt

  • 이미지 둘러보기(화면에 사진이 최대 20개까지만 나오도록 페이징) localhost_3000_topic_browsing_1

  • 검색 기능 검색

  • 회원가입 페이지 image

  • 회원가입 - 아이디 중복 체크 아이디 체크


  • 회원 비밀번호 정보는 데이터베이스에 암호화 한 후 저장 암호화 결과