20210313 25일차 제작자 페이지 구현 및 CSS

2021. 3. 14. 03:00·BootCamp_Codestates/Final Project

구현 사항

  • CSS 리팩토링(버튼 등 디자인 가다듬기) => 완료

  • 미디어쿼리 모두 손보기=> 완료

  • 애니메이션 효과 적용하기 => 완료

  • 개발자 소개 페이지 완성시키기 => 완료

  • 배포 세팅하기 => 명일 예정

  • 기술발표 준비 => 명일 예정

 

CSS 리팩토링

모든 버튼에 후버 효과 적용.

특히 메인 페이지의 버튼에는 참고사이트(codepen.io/bartekd/pen/qFsDf) 의 4번 효과를 적용했다.

차례대로 메인페이지, 회원가입, 모달창의 버튼

개발자 소개페이지 구현 완료

개발자 소개페이지를 완성했는데, 팀원 소개는 캐릭터를 적용했다.

 

반응형 웹 구현을 위한 미디어 쿼리 완료

제작자 소개 페이지의 작은 사이즈는 아래 모습과 같다. 480px 이하일때.

 

백그라운드 이미지

는 아무래도 이 웹서비스와 어울리는 배경을 쓰는 것이 좋을 것 같다.

도움받은 사이트

CSS 버튼: nanati.me/css-button-design/

Codepen: codepen.io/bartekd/pen/qFsDf

고화질 변환 사이트: waifu2x.booru.pics/

'BootCamp_Codestates > Final Project' 카테고리의 다른 글

20210315 27일차 배포후 에러 핸들링/메뉴얼 페이지 구현  (0) 2021.03.16
20210314 26일차 로딩 효과 구현  (2) 2021.03.15
20210312 24일차 제작자 페이지 구현중(80%)  (0) 2021.03.13
20210311 23일차 카카오, 구글 소셜 로그인 구현 완료(OAuth)  (0) 2021.03.12
20210310 22일차 카카오 소셜 로그인 구현(중)  (0) 2021.03.11
'BootCamp_Codestates/Final Project' 카테고리의 다른 글
  • 20210315 27일차 배포후 에러 핸들링/메뉴얼 페이지 구현
  • 20210314 26일차 로딩 효과 구현
  • 20210312 24일차 제작자 페이지 구현중(80%)
  • 20210311 23일차 카카오, 구글 소셜 로그인 구현 완료(OAuth)
JTB
JTB
웹/앱 개발 정보를 공유하고 있습니다.
  • JTB
    JTechBlog
    JTB
  • 전체
    오늘
    어제
    • All About Programming;) N
      • Computer Science
        • Terminology and Concepts
        • Network
        • Operating System
        • Database
        • Data Structure
      • Frontend
        • Javascript Essentials
        • Perfomance Optimization
        • JS Patterns
        • Next.js
        • Flutter
      • Backend
        • Node.js
      • DevOps
        • Docker & Kubernetes
      • Coding Test N
        • LeetCode N
        • Programmers
      • Tech Books & Lectures
        • Javascript_Modern JS Deep d..
        • Network_IT 엔지니어를 위한 네트워크 입문
      • Projects
        • PolyLingo_2025
        • Build Your Body_2024
        • JStargram_2021
        • Covid19 Tracker_2021
        • JPortfolio_2021
      • BootCamp_Codestates
        • TIL
        • TILookCloser
        • Pre Tech Blog
        • IM Tech Blog
        • Daily Issues and DeBugging
        • First Project
        • Final Project
        • Sprint Review
        • Good to Know
        • Socrative Review
        • HTML & CSS
  • 블로그 메뉴

    • 홈
    • 태그
    • 방명록
  • 링크

    • 글쓰기
    • 관리
  • 공지사항

  • 인기 글

  • 태그

    database
    How memory manage data
    Time complexity and Space complexity
    자바스크립트 딥다이브
    mobile app
    모던 자바스크립트 Deep Dive
    이벤트
    CPU scheduling algorithm
    프론트엔드 성능 최적화 가이드
    indie hacker
    Operating System
    Shared resources
    leetcode
    VoiceJournal
    need a database
    딥다이브
    Binary Tree BFS
    커리어
    JavaScript
    Data Structure
    DOM
    자바스크립트
    structure of os
    js pattern
    TCP/IP
    Threads and Multithreading
    polylingo
    Network
    testing
    스코프
  • 최근 댓글

  • 최근 글

  • hELLO· Designed By정상우.v4.10.5
JTB
20210313 25일차 제작자 페이지 구현 및 CSS
상단으로

티스토리툴바