드림오구
article thumbnail
Published 2023. 4. 14. 00:29
[TIL : 230413] 🐹 TIL/Daily

🌊 TIL : 2023년 4월 13일  

 

오늘 배운 것

UI/UX의 개념과 UI/UX의 차이

 

🌸 [UI/UX] UI/UX의 이해

🌊 UI/UX의 이해 UI (User Interface) : 사용자 인터페이스. 사람들이 컴퓨터와 상호 작용하는 시스템. 요즘은 화면상의 그래픽 요소를 UI라고 지칭하지만, 키보드, 마우스 같은 컴퓨터와 상호 작용하는

dreamogu59.tistory.com

쇼핑몰 목록 앱 만들기

 

🍰 [Project] 쇼핑 목록앱 만들기

🌊 쇼핑 목록앱 만들기 구현 요소 완료 HTML/CSS + 버튼을 누르면 리스트 추가하기 input을 입력후 엔터를 누르면 리스트 추가하기 미완료 휴지통 버튼을 누르면 해당 리스트 삭제되기 느낀점 구글

dreamogu59.tistory.com

 

어려웠던 부분

  • UI/UX 개념은 이미 공부했던 내용이라 알고 있었다. 그치만 아는 것과 구현하는 것은 전혀 다른 문제 ㅎㅎ.. 조금 더 익숙해지고 싶다. 디자인 쪽은 늘 어려운 것 같으나.. 프론트엔드 개발자로서는 해내야겠지!
  • 쇼핑몰 목록 앱의 버튼을 어떻게 내야할 지 고민.
    처음엔 폰트어썸 API를 가져와 <i> 태그를 삽입 하려 했는데 i태그를 생성하고, 클래스를 지정하고, 또 그 i태그를 버튼에 추가하는 것을 DOM 조작으로 하려니 번거로운 것 같아 현재는 휴지통 아이콘을 CSS를 이용하여 백그라운드에 넣었는데 어떤게 더 효율적인 방식인지 모르겠다. 

느낀점

  • 휴지통 아이콘을 CSS로 구현하는게 나을 지, JS로 구현하는게 나을 지 고민하게 되어 스스로 좀 신선했다. 여태껏은 늘 CSS는 약간 자신있어 CSS를 최우선으로 했기 때문에.. 

 

더 공부할 것

  • JS로 구현 vs CSS로 구현

'🐹 TIL > Daily' 카테고리의 다른 글

[TIL : 230418]  (4) 2023.04.19
[TIL : 230416]  (1) 2023.04.18
[TIL : 230412]  (4) 2023.04.13
[TIL : 230410]  (2) 2023.04.10
[TIL : 230408]  (2) 2023.04.08
profile

드림오구

@드림오구