modern-agile-team / dev-portfolio Goto Github PK

Description

기존 개발 환경에서 typescript 환경 구축 및 개발환경을 세팅하여 협업에 탄력을 더한다.

Progress

• typescript 구축
• esLint와 Prettier 적용
• 절대경로 설정

Description

remove p tag for subhead and head props when condition is false (like empty string, undefined, null etc...)

• to make it possible to adjust the position of a script

Description

Type으로 선언되어있는 것들을 모두 Interface로 전환. Enum 처리만 Type으로 한다.

<Type 선언 원칙>

• 컴포넌트에 사용되는 모든 Type은 '컴포넌트+Type.ts' 한 파일에서 관리하고, Interface로 선언한다.
• Type 키워드는 Enum 타입을 만들 때만 사용.

Progress Components

• Card
• Carousel
  • hooks
  • style
  • Carousel
• Channels
• Contact
  • AboutMe
  • Contact
  • ContactForm
• Experience
  • Experience
  • Basic
  • Box
  • index
  • Vertical
• Gallery
  • Gallery
  • Item
• Header
  • Header
  • Logo
  • SideBar
  • SideBarIcon
  • SideBarItems
  • SideContainer
• Intro
  • index
  • Intro
  • IntroForm
  • IntroTitle
• Masonry
  • Image
  • Masonry
• TechStack
  • TechStackInput
  • ProgressBar
  • TechStack
  • TechStackList
  • TechStackName

Description

[Refactor] Change wrong names 'uri' to 'url'

Progress

• Header component
• Channels Component
• Contact Component
• Logo Component

File

• src/lib/components/Channels/Channels.tsx
• src/lib/components/Contact/Contact.tsx
• src/lib/components/Header/Header.tsx
• src/lib/components/Header/Logo.tsx

Description

not any or string

Progress

• introOption
• testAlign
• background

Description

데모 앱 작업중 헤더 컴포넌트에서 필요하다고 느끼는 props/수정부분

Progress

• background-color pros 없음/ 배경색 없이 border-bottom 주는 옵션도 있으면 좋을 듯
• sidebarOption에서 item props의 type이 never[]이던데 어떤 값을 넣어야 할지 감이 안잡힘
• header자체 높이 지정해주는 props가 있었으면 좋겠음

Description

Contact 컴포넌트에서의 개선사항

Progress

• 배경색(background-color) props가 있었으면 좋겠음
• aboutMeInfos props의 타입이 Object로 선언되어있던데, 좀 더 명시적인 타입이였으면

Description

update features of all components for routing to clicked things

Progress

• Contact component
• Image component
• Card component

Description

Move files in app to ROOT

WHY

This is because the contents of README.md are not visible on the NPM page.

Description

progressBar 컴포넌트에 필요한 props를 추가하여 재사용성을 높힌다.

Progress

• rate 표시 여부를 지정해주는 props
• ProgressBarContainer에서의 border 가 없었으면 좋겠음 (현재 border: 1px solid #fff;로 지정되어있음)

Description

Gallery 컴포넌트에서의 개선사항

Progress

• 열을 지정하는 props가 col로 되어있던데, column으로 변경해서 좀 더 명시적인 props명이였음 좋겠음

• description에서 \n일때 줄바꿈 처리가 되었으면 좋겠음

• padding="0em 20em"일때 웹
  

• padding="0em 20em"일때 max-width 768px
  

Description

Fix the events when the image component is hover.

Progress

• create zoom option when image hover
• to enable width setting
• prevent horizontal length from stretching when zoomed in

Description

update project version to v1.0.0

Description

not work size props in teckstack

Description

it dislocated because of date location.

• make it's width(max-width) fixed

Description

v0.2.0의 컴포넌트들을 개발하고 기능을 더하여 구현한다.

Progress

• Introduction 컴포넌트

  • 포트폴리오의 인트로에 삽입되는 짧은 자기소개 컴포넌트

• PortfolioList 컴포넌트, ExperienceList 컴포넌트
  : 하나에 국한되지 않은 ui library

  • Gallery 컴포넌트
    • item 컴포넌트
  • Carousel 컴포넌트
  • masonry 컴포넌트
    • image 컴포넌트
  • 카드 컴포넌트
    • 직사각형
    • 원형
    • 사각형: 둥근모서리

• Experience 컴포넌트
  : 텍스트로만 이루어진 경험 컴포넌트

Description

develop components of version 0.2.0 and implement added functions.

Progress

• Introduction component

  • Short self-introduction components inserted into the intro of the portfolio

• PortfolioList, ExperienceList component
  : A lot of different ui library

  • Gallery component
    • item component
  • Carousel component
  • masonry component
    • image component
  • Card component
    • square
    • round
    • round-square

• Experience component
  : Experience component consisting of text only

Description

remove useless static files in public folder

Progress

• remove public/logo_test.png
• remove useless datas in public/manifest.json

Description

update 'imgURL' name to 'src' of Item component

Progress

• update 'imgURL' name to 'src' of Item component

Description

dev-portfolio에서의 모든 컴포넌트에 타입독을 작성하여 props 사용성을 높힌다.

Progress

• Header
• Channels
• TechStackList
• Contact
• Intro
• Gallery
• Item
• Card
• Masonry
• Image
• Carousel
• Experience
• VisitorCounter
• VisitorComment

Description

캐러셀 컴포넌트 props들에 대한 설명이 필요해 typedoc을 추가하여야함

TODO

• 캐러셀 컴포넌트가 가지는 props들에 대한 설명
• 개별 props에 대한 설명

Description

reinforce carousel feature
reference1
refernece2

Progress

• clone last and first element
• slide by drag & drop and touch
• item size freeze
• play button (stop, play)

Description

서비스 품질 향상을 위한 디테일 작업

Progress

• item 컴포의 기본 이미지 랜덤이미지로 수정
• TechStackList 컴포의 디폴트 프롭스중 rate 값이 모두 보이도록 수정
• sidebarOption에 디폴트값으로 teckstackInput만 id가 추가되어있음. 모두 안보이도록 수정
• visitorCounter 컴포에 디폴트 테마의 background컬러가 살짝 띄어있음. 모두 채워지도록 수정
• contact 컴포에 사는 곳을 강동구가 아닌 서울로 수정
• 반응형시 visitorComment 컴포의 폰트 사이즈가 너무작음. 수정

Description

update styles of TechStacks Component

Progress

• update size of Tech name's text so that it adjustable 기술 이름 텍스트의 크기가 조절 가능하도록 수정
• update size of Progress bar so that it adjustable 프로그레스바 크기 변경가능하도록 수정

Description

If there are less than six sub-elements in the masonry component, reduce the number of columns to two lines and maintain the masonry format.

Description

Create number of Experience Component themes

Progress

• Basic
• Box
• Vertical

Description

When mouse hover Image in Masonry component it's height increase to bottom a little

Progress

• Image size must not changeable

Description

Intro 컴포에서의 수정사항

Progress

• box-shadow bottom쪽에만 들어가있음 -> 전체적으로 줘야할듯
• 미디어쿼리 모바일px로 적용시 전체 div태그의 padding 값 조절

Description

[Fix] Have to fix the id props so that it available.
id 프롭스를 사용가능하도록 수정해야한다.

Progress

• Header component

Description

eslint 규칙에 적용하여 코드를 리팩터링 하며 기존의 js파일들을 ts으로 리팩터링 한다.

Progress

• styled-components module err fix
• eslint err all refactoring
• eslint iconfy err refactoring
• Channel component ts refactoring
• Contact component ts refactoring
• Header component ts refactoring
• TeckStack component ts refactoring

Description

Upgrade TechStackInput UI

Before

After

Description

Blinking animation is set by default, and let's make it possible to choose whether to use it as True False.

Progress

• set boolean props to select animation

Description

Fix breaken UI when header width is less than 400
헤더 너비가 400 미만인 경우 손상된 UI 수정.

Progress

• Width가 몇일 때 UI가 깨지는지 분석
  • 400 미만 부터 width가 100% 넘어가는 것 같음
  • 로고의 margin은 반응형 문제가 아닌 것 같다. 처음부터 sideBar 아이콘이랑 margin 값이 다르다.
    margin을 받지 않고 기본값으로만 되도록 하거나, margin을 top, bottom만 받도록 해야할 것 같다.
• logo의 margin으로 인해 width가 작을 때 UI 깨지는 문제 해결
• 반응형에 맞춰 헤더의 width가 100%가 넘어가지 않도록 수정

Description

now

Object-fit: contain;

Description

Description

All of components's ID attribute must register for appending in Sidebar Component.

Progress

• App 클래스를 가진 태그 안에 있는 id를 전부 읽어서 사이드바에 등록

Description

Add the VisitorCounter props.
방문자 계수기 프롭스 구현.

Progress

• 3가지 테마구성 (default, big-size, simple)
• 스타일 관련 props 설정 (마찬가지로 props 목록 확인바람)

Description

Experience 컴포넌트의 사용하지 않는 props를 삭제한다.

Progress

• Background Props

Description

Now the app does not offer responsive UI. I think we must offer responsive UI to users

Progress

• implement responsive web

Components

• Header
• Contact
• Experience
• Masonry
• Gallery

Description

Description

Add the VisitorComment props.
방문자 댓글 프롭스 구현.

Progress

• 3가지 테마 구성 (basic, box, vertical)
• 스타일 관련 props 설정 (너무 많아서 props목록 확인바람)
• height 길이 overflow시 progressbar와 scrollDownIcon 생성

Description

separate all of 'option' props

translate to korean

하나로 엮여있는 option 프롭스를 각각의 프롭스로 분리한다.

Progress

• ...

Description

캐러셀 기능 개선 및 추가

Progress

• 캐러셀 아이템 생성 방식 변경 (children 개수만큼)
• cursor pointer

Description

Improve UI of Sidebar

• before UI.

• after UI.

Description

아이템 컴포넌트에 마우스를 올렸을때, 깜빡거림 현상이 나타남.

Progress

• 깜빡거림 현상 나타나지 않도록 수정

Description

I suggest that change props name "moveURL" into "redirectURL"

Description

기술스택 컴포넌트에서의 개선사항

Progress

• fontSize/logoSize props 적용 안된거 같음
• iconColor Props 적용 안됨
• progressBar 두께 조절할수 있는 props있었으면
• logo name은 적을수 있게 하되 title값은 사용자가 작성할수 있게 했으면 / 아니면 name 값이 안보이게
  ex)
• typescript는 아이콘 모양이 3개임

• 다른 아이콘 모양으로 하고싶었으나 name에 -icon까지 같이 보이게 됨

Description

cannot run when implement Header props

Description

title is content

Description

방명록 생성을 위한 이벤트 핸들러를 받는 props를 추가해야한다.

Todo

• 방명록 생성
• change 이벤트 핸들러
  • 1. 댓글
  • 2. 닉네임
  • 3. 비밀번호

Description

remove props called 'styles' and append those props in origin props

Progress

• Header component
  • Logo Component
  • SideBar Component