웹 퍼블리셔10

• 

  jQuery Zoomer를 이용하여 이미지를 확대 축소 해보자 이번에 필요했던 기능은 header와 bottom을 고정한 상태에서 이미지 영역만 확대를 시킬 수 있는 기능이 필요 했습니다. 은행이나 카드 상품 정보에서 약관을 PDF나 이미지 정보로 보여주는 기능을 볼 수 있는데, 이 기능이 필요해서 작성을 하게 되었습니다. HTML부터 CSS와 그리고 jQuery 플러그인인 Zoomer 플러그인을 사용해서 이미지를 확대하고 스크롤 할 수 있는 기능까지 추가로 알아봅시다.0. 준비하기 (CDN)jQuery 플러그인 Zoomer를 사용하기 위해서는 기본적으로 jQuery가 필요하고, zoomer.js가 필요합니다. 파일이 있으시면 추가하시면 되지만, 저는 CDN 기준으로 작성 하였습니다. zoomer.css 역시 추가 해주시면 됩니다. 해당 CSS는 확인해보니 라인 수.. jQuery 2024. 9. 6.

• 

  chart.js를 살짝 익혀봅시다 chart.js는 생각보다 어렵지 않습니다. 생각보다 단조롭고, 싱글 데이터값부터 멀티 데이터값까지 다양하게 넣을 수 있는 장점이 있습니다. 그동안 chart.js에 대해 많이 쫄아(?)있었지만, 생각보다 어렵지 않게 이용이 가능했습니다. 아직까지는 데이터를 불러와서 적용하는 부분보다는 random이나 고정값으로 밖에 테스트를 하지 못했습니다. 그래도 그려지는 부분, 원리를 아는 것이 가장 중요한 것이니까!! 1. chart.js 연결 CDN이나 파일로 연결을 하면 사용할 준비가 된 셈입니다. 저는 테스트를 목적으로 하는 부분이기에 CDN으로 연결을 하였으나, 실제로 chart.js를 서비스에 포함시킨다면 파일로 연결을 해야 이롭습니다. 2. 영역 만들기 영역을 잡지 않고 다이렉트로 mychart(def.. JavaScript 2021. 10. 28.

• 

  [웹 퍼블리셔 189일차] 결함과의 싸움! 정말 오랜만에 글을 쓰게 되었습니다. 거의 두 달 만에 글을 쓰게 되면서 그간 있었던 것 중에 가장 많이 했던 제 실수부터 잘 놓치는 부분을 크게 3개를 써봤습니다. 계속해서 프로젝트를 진행할 때 참고하고, 또 참고하고 신경쓰기 위해서 작성 하였습니다. 1. 크로스브라우징에 신경쓰자 제가 가지고 있는 휴대폰은 갤럭시노트10으로 디바이스 화면도 크다고 생각하지 못했습니다. 제가 생각했던 크로스 브라우징이라는 것은 크롬, 사파리, IE 환경에서 레이아웃이 달라지지 않아야 한다는 것! 바로 그 뿐이라고 생각했습니다. 하지만, 어플리케이션에서 브라우저 환경을 보는 것이 아닌, 디바이스별로 화면에서 레이아웃이 깨지는지 확인하는지 이번 프로젝트를 통해서 알게 되었습니다. 참 다양한 환경에서 레이아웃이 틀어지는 부분.. 웹 퍼블리셔 일기 2021. 10. 10.

• 

  [웹 퍼블리셔 127일차] 항상 히스토리를 남겨두자! 뭐 별일은 아니었습니다. 어떻게 생각하면 당연하고, 당연하고 당연한 일이었는데.. 구두로 내용들을 전달하고 하는 부분이 문제가 터졌습니다. 뭐 터질일이 터졌다고 생각하고 있기 때문에 누구를 탓하겠습니까.. 저의 잘못이지! 구두로 다른 일들이 많아서 뒤로 미뤄져도 괜찮냐고 했을 때 동의했는데.. 제가 작업을 마무리하지 못해서 후속 작업들이 이루어지지 못했다고 해서 조금은 당황했습니다. 그래도 넓게 보면 팩트는 맞기 때문에 빠른 사과와 인정을 한 후에 바로 작업을 착수했습니다. 항상 메신저 및 메일을 파일화를 하는 것이 좋습니다. 개인적으로는 everything을 사용하면서 파일화를 하고 있었는데 이번 건만 계속해서 구두로 전달하다보니 누락이 된 것 같았습니다. 간단하게라도 메신저라든지 구두로 전달을 했다면.. 웹 퍼블리셔 일기 2021. 8. 9.

• 

  [웹 퍼블리셔 125일차] 커뮤니케이션을 잘해야 한다! 정말 오랜만에 글을 쓰는 것 같습니다. 현재 프로젝트를 하면서 오픈이 얼마 남지 않았고, 그에 따른 야근이 필수로 하게 되면서 많은 내용들이 오고 가고 하는 것에 느끼는 것이 많았습니다. 현재 제 경우에는 9월까지 프로젝트를 하게 되는데, 7월 한 달 동안 어떠한 일을 했는지 살짝 나열해보려고 합니다. 프레임워크를 이용해서 제작한 코드 분석 개발자들과 커뮤니케이션 Chrome Inspect를 통해서 개발 버전 어플리케이션 디버깅 체크 개인적으로 제일 힘들었던 부분은 2번 항목이었습니다. 웹 퍼블리셔의 경우는 기획서보다 디자인 시안을 보고 마크업을 진행하는 부분인데, 기획서와 틀리다고 오시는 분들이 생각보다 많았습니다. 기획서는 Mock으로만 그려지는 부분이기 때문에 디테일한 부분이 아닌, 어떻게 어떻게 .. 웹 퍼블리셔 일기 2021. 8. 7.

• 

  [웹 퍼블리셔 104일차] 여전히 어렵고, 어렵고, 어렵다 무더운 여름이 왔지만, 그런 것을 느끼지 못할 정도로 엄청나게 바쁘게 100일하고도 4일이 더 지났습니다. 이 중간에 자바스크립트 책도 구매하고, 공부를 정말 나노(?)만큼 공부를 하고 있지만 티끌모아 태산이라고 생각하면서 꾸준하게 공부하고 있습니다. 여전히 jQuery를 사용하는 프로젝트도 있고, Vue.js를 사용하는 프로젝트도 앞으로 잡혀있기 때문에 공부를 게을리 할 수 없게 되었습니다. (React 겁나 공부했는...) 현재는 금융권 프로젝트를 진행하고 있는데, 이전에 했던 하드코딩이 아닌 프레임워크를 이용한 페이지 작업을 하고 있습니다. 금융권 프로젝트에서 제일 어렵고, 어렵고, 어려운점은 바로 외부망이 접속이 되지 않는 부분이었습니다. 당연히 금융권 프로젝트를 진행하게 되면 민감한 정보들이 노.. 웹 퍼블리셔 일기 2021. 7. 17.

• 

  [웹 퍼블리셔 73일차] PSD 시안에서 홀수 작업은 어렵다. 다른 웹 페이지를 작업하면서 반응형을 고려한 시안들이 계속해서 넘어오고 있습니다. 아무래도 많은 웹 페이지 작업을 해야 저 역시도 성장할 것이라고 생각하는데.. 그건 그거고! 이제 디자인에서 넘어오는 시안들을 받게 되면 조금은 놀라는 경우가 있습니다. 2배수, 3배수로 작업하시다 보면 홀수로 작업을 하시는 분들이 왕왕 있기는 합니다. 여기에서 여러가지를 제안할 수 있었는데, 제 경우에는 협의가 빨라서 바로 작업에 착수 할 수 있었습니다. 소수점으로 나오는 부분을 버림 - 반올림 처리 px 짝수로 작업 재요청 그래도 확실하고, 퀄리티가 있다면 아래의 방향으로 재요청하는 것이 좋지만, 작업물이 많거나 수정할 것이 많다면 PM, PL 분들과 머리를 맞대고 작업을 처리하는 것이 좋습니다. 퍼블리셔가 임의대로 하.. 웹 퍼블리셔 일기 2021. 6. 16.

• 

  [html] tbody 여러 번 사용할 수 있다 2단으로 게시물들을 작업할 때 li 태그로 작업하는 방법도 있지만, table 태그로 th와 td로 사용하는 방법도 있습니다. 그러면서 의문도 생겼습니다. tbody를 여러 번을 줘야하는 경우가 생기는데, 과연 tbody를 여러 개 사용해도 웹 표준에 문제가 없을지 궁금했습니다. ...생략 정답은 tbody는 갯수 제한없이 사용이 가능합니다. 반면 thead의 경우는 한 테이블에서 한 번만 사용할 수 있다고 하니, 이 부분도 코딩을 하면서 체크를 해야할 것 같습니다. (사실 이전에는 잘 몰라서.. ul > li 위주로만 사용했었습니다.) ...생략 지금은 이렇게 "tbody가 아~ 3개구나" 하면서 잘보이겠지만, 안에 내용들이 엄청 많아지면 조금은 관리가 어려운 점도 있었습니다. 금일 작업하면서 궁금했던.. HTML 2021. 6. 16.

• 

  [웹 퍼블리셔 67일차] 다음 프로젝트를 기다리면서 이전 51일차에 썼던 부분에서 프로젝트를 마무리하지 못해서 너무 아쉬운 마음에 포스팅을 했었습니다. 그래도 다음 프로젝트가 잡히면서 조금은 안심을 하게 되었습니다. 그래도 프로젝트가 성사되고, 진행하다가 철수하는 그런 부분을 보게 되면서 조금은 눈치(?)가 생겼습니다. 그러면서 notion(노션으로 표기)을 통해서 그동안 작업했던 내용을 정리할 수 있는 시간이 생겼고, 그리고 zeplin(재플린으로 표기)을 통해서 조금 더 빠른 작업을 하는 것과 간접적으로 협업을 하는 부분을 다시 한 번 복기하였습니다. 다음 프로젝트는 조금 투입 기간이 길어지고, 혼자 들어가게 되지만.. 생각보다 혼자있는 시간을 참 즐겨하기 때문에 업무적인 어려움만 뺀다면 잘 보낼 수 있을 것으로 예상됩니다. 최근 웹 퍼블리셔 취업 관.. 웹 퍼블리셔 일기 2021. 6. 10.

• 

  [웹 퍼블리셔 51일차] 나를 되돌아볼 수 있는 시간이다! 이제 입사한지 50일이 조금 넘었습니다. 첫 프로젝트는 아쉽게 보내게 되었지만, 이러한 시간을 부족했던 공부를 할 수 있게 된 것으로 위안(?)을 삼게 되었습니다. 같은 회사 직원분들, 그리고 학원 동기들은 프로젝트를 진행하고, 완료 하면서 스펙을 쌓는 그러한 부분에서 처음에는 조바심을 가지게 되었지만, 한편으로는 부족한 공부를 하고, 필요한 부분이 어떤건지 몸으로 느끼게 된 프로젝트 투입이었습니다. 웹 퍼블리셔로서 많은 기술들(?)을 가지고 있으면 좋은 것은 사실입니다. 하지만, 생각보다. 하지만 클라이언트가 요구하는 부분은 천차만별이고, 설득이나 다음 플랜을 제시하는 방법들도 많이 배울 수가 있었습니다. 제 경우에는 설득도, 다음 플랜도 진행할 수 없는 부분이었기에 조금은 아쉬웠지만… 다음 프로젝트가.. 웹 퍼블리셔 일기 2021. 5. 27.