인스타 UI클론코딩 2일차..
아 우선 머리가 너무 아프다... 어제 오늘 머리가 지끈지끈 하다
머리속에 너무 많은 내용을 넣을라 해서 그런가 그래도 재밌게 즐기고 있으니 좋은 것 같다!
어제에 이어 오늘도 열심히 기능 구현을 하고 있다!!!!
-
포커스 구현
커서로 그 부분이 포커스가 되면 커서를 변경해주는 작업을 전체적으로 진행했다! 각종 아이콘들에 적용을 햇다
정말 간단한 작업이다.
cursor : pointer; -
오늘도 배치와의 싸움이다..
div가 하나씩 늘때마다 다시 배치해주고 미디어쿼리 부분 다시 배치해주고,, 정말 배치의 연속이다
그래도 position: absolute; 가 유용하게 써주고 있어서 다행이다 이제 어느정도 postion , display 의 값에 대해서
감이 잡힌것 같다 배치를 보고 알아서 손이 가는... 좋은 발전 인 것 같다 -
캐러셀
JS 로 캐러셀을 구현하려했었다. 70% 정도 구현이 완료 되었었는데 버튼부분이 기능작동을 안하는 것이였다.. 여기서 부터 문제를
찾기 시작했다. 처음에는 position: absolute; 를 먹고 있어서 안되는가 했더니 그건 아니였다. 일단 내가 찾은 원인은 버튼이
이미지 안에 들어가서 이다. 정확히는 캐러셀 컨테이너 부분에 들어가면 작동을 안하는 것이다. 이것에 대해서 해결 방법은 찾지 못햇다. UI작업이 어느 정도 끝나면 다시 JS 로 리펙토링 할 생각이다. 지금은 부트스트랩으로 넣어줬다 .
<중간에 누군가 부트스트랩에서 3개 붙여쓰면 기능작동이 안한다고 하는데 ID 값만 바꿔주면 간단하게 해결 할 수 있다. 알려드리고
싶었지만 그당시 JS로 작업중이였고 한참뒤 채팅창이 없어져서.. 해결하시길 바랍니다!>
- focus out !
오늘 굉장히 애먹은 부분이다. 내가 열심히 js로 기능 구현을 해도 아무리해도 작동이 안된다... 그래서 팀원 분들에게
도움을 받아서 다시 코드를 작성 해도 안된다!! 도대체 이유가 뭐지 .. 계속 이유를 찾던 도중 내가head부분에 js를 임포트해논게
문제였다. 중간에 기능이 작동하지 않아 body 부분에도 임포트를 해놨는데 이게 겹치면서 작동을 하지 않았던 것이다. head 부분에 임포트를 지워주는 것으로 간단히 해결. 소스코드는 내것이 아니지만 100% 이해와 구현이 가능하기 때문에 우선을 이코드로 작업을 하였다.
const page_input = document.querySelector(".page_input");
const page_input_icon = document.querySelector(".page_input_icon");
page_input.addEventListener('focus', (event) => {
// search_input_box.style.left = "-13.3%";
page_input_icon.style.visibility = "hidden";
})
page_input.addEventListener('focusout', (e) => {
// search_input_box.style.left = "13.3%";
page_input_icon.style.visibility = "visible";
})- 전체적인 부분
오늘도 전체적으로 디테일하게 작업을 이어 나갔던 것 같다. 하나하나 차근히 그래도 목표치의 80% 정도는 구현을 한 것 같다.
아직 모달부분이 남아 있지만,, 내일 부터는 적극적으로 js 을 이용해서 작업을 할 예정이다. 일단은 댓글창 부분도
하드코딩으로 p태그를 붙여놨지만, 입력값을 받아와서 그대로 붙여주는 것 까지 작업을 할 예정이다. 할 수 있 다!!!!!!
코드를 올리고 싶지만 작업량이 많아지면서 글이 너무 길어질 것 같아서 생략을 해야 될 것 같다.
어제올려논 부분들 그것들에 대한 활용이 대부분이다 그리고 새로운 기능 구현을 계속 공부하고.
페이지를 만들면서 느끼는 거지만 정말 개발자들의 땀과 정성이 들어 있는 것 같다. 따라만 하는데도 이렇게 어려우니
백지 상태로 무언가를 만들려면 더욱더 어려운 것 같다. 거기에 내가 해야될 백엔드 부분 까지 갈라면 아직도 갈 길은 멀다!
기능 하나하나에 시간이 많이 들고 있지만, 하나 해결하면 다음 작업에서는 시간이 많이 줄어드니깐 값진 시간 이라고 생각한다.
내일도 지치지 말고 화이팅 했으면 좋겠다.
