일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | ||||||
2 | 3 | 4 | 5 | 6 | 7 | 8 |
9 | 10 | 11 | 12 | 13 | 14 | 15 |
16 | 17 | 18 | 19 | 20 | 21 | 22 |
23 | 24 | 25 | 26 | 27 | 28 |
- 자바
- 코틀린
- 알고리즘
- SW봉사
- 백준
- 코딩봉사
- java
- 데이터베이스
- 코딩교육봉사
- 소프티어
- kotlin
- softeer
- 백준 알고리즘
- 공부일지
- 1과목
- 문제풀이
- BFS
- 백준알고리즘
- 정보처리산업기사
- 파이썬
- python
- programmers
- 회고
- 프로그래머스
- CJ UNIT
- 시나공
- 스프링
- MYSQL
- C++
- SQL
- Today
- Total
목록기타 학습/기획, UI, UX (19)
JIE0025

극초기 버전이 너무 안예뻐서 어떻게 개선했는지도 안보여주려고 바로바로 수정해버렸다 ✅ 개선된 UI 내부 컨텐츠의 width, height 비율 맞추기 헤더 아래 버튼 3개 제거 잔디 7일 * 4주 * 6개월로 변경 (기존에는 의미없는 크기였음) activity에 나타날수 있는정보가 3개이상될 경우는 드물거라 생각이 들어, 2개로 설정 공지글 잘보이게 ⏺ ver.01 (초기버전 개선) ⏺ ver.02 (POST UI와 흡사하게 제작)

✅ 동아리 활동 이력 생성 ✅ 회원수정 페이지 개선 비밀번호 변경이 회원정보수정과 함께 있는 상황이었음 중요한 정보 수정이므로 비밀번호 변경만 따로 페이지를 뺌 ⏺ 이전의 페이지 ⏺ 개선된 - 컴포넌트 ⏺ 개선과 함께 추가된 페이지

✅ 회원 수정 컴포넌트를 위한 UI 디자인 및 설계 ✅ 홈페이지에 디자인 적용 ver.

✅ Prototype ✅ 프론트엔드 가이드라인 ⏺ 참고 중인 블로그 https://bestinu.tistory.com/52 [Spring] JPA를 사용한 카테고리 (하위메뉴) 구현 JPA를 사용한 카테고리 (하위메뉴) 구현 오픈마켓 프로젝트에서 상품들을 카테고리 별로 분류하기 위해 카테고리 기능을 구현하게 됐다. 카테고리는 depth가 있기 때문에, 하위 메뉴까지 가져올 bestinu.tistory.com Create 는 카테고리 API를 위에처럼 보내주면 될것 같고,,, Read, Update, Delete는 댓글 하듯 해주면 될것 같다는 생각이 든다. 블로그 글을 좀더 찾아봐야겠다. 오늘은 AWS 책좀 더 하다가 자야지

이걸 만들고 나니까 기능 명세를 좀더 확실히 해야겠다는 생각이 들었다. 스프링 공부하고 플젝 적용하기에도 바쁘지만 잠을 줄이든 유튜브 보는 시간을 줄이면 여유시간이 있는 건 맞으니까 ㅎㅎ 이런 시간이 생기면 (포트폴리오로 사용하기 좋게) 플래그 프로젝트를 어떻게 개선할지 고민해봐야겠다.

✅ 게시글 뷰 UI 업데이트 ✅ 댓글 형식 개선 ⏺ 게시글 (post) 해당 게시글 전체 댓글영역 위에 댓글 입력 input태그가 존재한다. ⏺ 댓글 (Reply) 댓글은 만 적을 수 있다. 에게는 “댓글을 입력하세요” 가 보인다. 에게는 “로그인한 유저만 댓글을 달 수 있습니다 ” 가 보이고, [등록]버튼은 보이지 않는다. 댓글에는 [댓글번호]가 보여야한다. 댓글 아래엔 [답글달기]가 있어야한다. 본인이 단 댓글엔 [삭제하기]가 있어야한다. [답글 달기]를 클릭할 경우, 댓글 아래에 답글을 달수 있는 input태그가 나타나야한다. [답글 달기]를 다시한번 클릭한 경우 input태그가 사라져야한다. 만약 2번 댓글이 삭제될 경우, 3번 댓글이 2번으로 보여야한다. ⏺ 답글 (Reply - parent/c..

✅ 피그마 페이지 구조 개선 기존에 한 페이지에 있던 난잡한 구조에서 페이지 분리 📋 UI- MARKUP 시맨틱 태그별 공통 디자인 추출 Body 내용 길어지면 무한스크롤 스크롤 내려갈 경우, 사이드바는 fix 해주기 📋 BOARD - (POST, REPLY) 전체적인 디자인 개선 마구잡이로 있던 내용들 ▶ Section 영역 내부로 들여보냄. 댓글과 답글 디자인 게시판을 선택해주세요 옆에 ▽ 이거 있으면 좋겠다 파일 - (사진, 파일) 정도의 추가가 가능하게 할 것임. 파일은 erd에서 link로 연결되어 있다는거 기억하자 하트 누르면 색칠되어야함. 내가 어떤 게시판에서 글쓰기 버튼 눌렀으면 게시판 자동으로 해당 게시판을 디폴트 값으로 설정되어야함 📋 USER ERD에 의해 SIGN UP 에 EMAIL..

반응형 웹을 배울 때 가장 기초라고 생각되는 것이 바로 미디어 쿼리 문법이다. @media 쿼리를 사용함으로써 장치나 화면 비율에 따른 다른 레이아웃 디자인을 할 수 있다. 먼저 예제를 통해 사용방법을 구경해보자. ----------------------------------------------------------------- style sheet 내부나 css 파일에다가 작성한다. @media and (min-width : 100px) and (max-width : 700px) { .container{ background-color:#00ff00; transition-property: background-color 0.5s; } } @media 다음에 and 가 나와있는것을 볼 수 있다. 이는 '연..