반응형 분류 전체보기62 [웹 퍼블리셔 125일차] 커뮤니케이션을 잘해야 한다! 정말 오랜만에 글을 쓰는 것 같습니다. 현재 프로젝트를 하면서 오픈이 얼마 남지 않았고, 그에 따른 야근이 필수로 하게 되면서 많은 내용들이 오고 가고 하는 것에 느끼는 것이 많았습니다. 현재 제 경우에는 9월까지 프로젝트를 하게 되는데, 7월 한 달 동안 어떠한 일을 했는지 살짝 나열해보려고 합니다. 프레임워크를 이용해서 제작한 코드 분석 개발자들과 커뮤니케이션 Chrome Inspect를 통해서 개발 버전 어플리케이션 디버깅 체크 개인적으로 제일 힘들었던 부분은 2번 항목이었습니다. 웹 퍼블리셔의 경우는 기획서보다 디자인 시안을 보고 마크업을 진행하는 부분인데, 기획서와 틀리다고 오시는 분들이 생각보다 많았습니다. 기획서는 Mock으로만 그려지는 부분이기 때문에 디테일한 부분이 아닌, 어떻게 어떻게 .. 웹 퍼블리셔 일기 2021. 8. 7. [CSS] 삼각형을 조금 더 쉽게, 만들어보자! (css 트라이앵글 제네레이터) 웹 사이트를 보다보면 셀렉트박스나 콤보 박스 등에서 ▲ 이런 모양의 삼각형이 가끔 나오는데, 이미지 파일로도 쉽게 가능하지만, CSS로도 충분히 표현이 가능한데 이번에 소개하려고 하는 사이트는 삼각형 모양을 쉽게 만들 수 있는 제네레이터 사이트입니다. Direction은 삼각형의 방향입니다. Top으로 하면 ▲ 이런 모양으로 나오게 되고, Top 방향부터 총 8방향으로 설정이 가능합니다. Type에서 Equilateral(정삼각형), Isosceles(이등변), Scalene(부등변 삼각형)을 선택할 수 있습니다. 이 타입을 선택할 때 사이즈를 조절하는 기능이 활성화가 되기 때문에 필요한 타입으로 선택을 해서 커스터마이징을 하면 됩니다. Color에서 색상을 선택하는데, RGB, HSB도 지원합니다. 다.. CSS 2021. 7. 20. [웹 퍼블리셔 104일차] 여전히 어렵고, 어렵고, 어렵다 무더운 여름이 왔지만, 그런 것을 느끼지 못할 정도로 엄청나게 바쁘게 100일하고도 4일이 더 지났습니다. 이 중간에 자바스크립트 책도 구매하고, 공부를 정말 나노(?)만큼 공부를 하고 있지만 티끌모아 태산이라고 생각하면서 꾸준하게 공부하고 있습니다. 여전히 jQuery를 사용하는 프로젝트도 있고, Vue.js를 사용하는 프로젝트도 앞으로 잡혀있기 때문에 공부를 게을리 할 수 없게 되었습니다. (React 겁나 공부했는...) 현재는 금융권 프로젝트를 진행하고 있는데, 이전에 했던 하드코딩이 아닌 프레임워크를 이용한 페이지 작업을 하고 있습니다. 금융권 프로젝트에서 제일 어렵고, 어렵고, 어려운점은 바로 외부망이 접속이 되지 않는 부분이었습니다. 당연히 금융권 프로젝트를 진행하게 되면 민감한 정보들이 노.. 웹 퍼블리셔 일기 2021. 7. 17. [CSS] 여전히 헷갈린 Float 해제 방법을 정리! 요즘에는 레이아웃을 잡는 방법이 display: flex를 이용하여 다양한 방법으로 하지만, 그래도 아직까지는 IE를 대응해야하기 때문에 float을 사용하는 방법을 그래도 알고 있어야 합니다. (뼈저리게 느끼고 있습...) 일단 float을 사용해서 레이아웃을 잡는 경우는 바로 가로로 배치하려고 하는 부분에서 사용이 됩니다. 하지만 float을 많이 사용하지 않는 이유는 해제하는 방법이 까다로워서 그런 것이 아닐까? 그리고 flex나 다른 방법으로 가로 배치하는 방법도 많은데 궂이? 라고 생각하시겠지만 꼭! 알아두시는 것이 좋습니다. left 요소를 왼쪽에 배치 right 요소를 오른쪽에 배치 ※ HTML 코드 안녕하세요 저는 Lorem ipsum dolor, sit amet consectetur ad.. CSS 2021. 6. 28. [웹 퍼블리셔 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. [ETC] 웹 퍼블리싱 가이드의 필요성! 이제 퍼블리셔로 근무한지 50일이 되었습니다. 진행하던 프로젝트는 아쉽게도 조기에 종료(?)가 되면서 패잔병 모드로 쓸쓸하게 보내고 있었습니다. 그래도 제 역량을 꾸준하게 업그레이드 하기 위해서는 다양한 작업들이 필요한데 그 중 하나가 바로 문서 작업인 웹 퍼블리싱 가이드를 작성하는 것 입니다. 대관절 웹 퍼블리셔는 코딩만 잘하면 되는 거 아냐? 그것에 대한 답변은 케바케이기는 합니다만, 이제 더욱 성장하신다는 조건으로 이야기를 하자면 바로 이러한 가이드작성이야말로 본인의 스킬이 업이 된다고 할 수 있습니다. 일단 웹 퍼블리싱 가이드는 코딩에 대한 가이드라인을 정의하는 것부터 시작해서 코드의 가독성부터 네이밍 등의 일관성을 하는 부분에서 큰 의미를 두고 있습니다. 퍼블리셔들이 서로 다른 경력들이 있고, .. 카테고리 없음 2021. 5. 24. CSS 선택자의 점수가 있다! (점수 환산표) CSS 작업을 하다가 요소를 선택하는데, 적용이 되지 않았던 적이 몇 번 있었습니다. 그런데 그런 부분이 CSS 선택자에 대한 부분이란 걸 알았고, CSS 선택자에도 점수가 존재한다는 것을 알게 되면서 조금 찾아보고, 저와 같은 실수를 하지않았음에 정리를 해봤습니다. * CSS 선택자 점수는? !important : 10,000점 Inline Style: 1,000점 ID 선택자: 100점 Class 선택자: 10점 Tag 선택자: 1점 위의 점수로 봤을 때는 그럼 !important 사용하면 되는거 아냐? 인라인 스타일 작성하면 되는 거 아냐? 라고 하지만, 막상 개인적인 작업이나 업무를 통했을 때 이렇게 작성을 하게 되면 수정(=유지보수)을 하는 부분에서 굉장히 어려움을 느낄 수 있습니다. 인라인 스.. CSS 2021. 5. 21. [React] 리액트 컴포넌트를 만들어보고, 호출해보자! 이번에 정리를 하는 내용은 리액트를 시작하게 되었습니다. 제 경우에는 집에서 작업을 하는 환경은 Window PC를 이용하고 있고, 실제 업무로는 mac을 이용하고 있습니다. 아무래도 저는 더욱 친숙한 window로 리액트를 공부하고 있습니다. 설치 파일 관련한 내용은 따로 정리하겠습니다. (현재 모든 세팅이 마친 상태로 내용 정리를 하는 것입니다.) 리액트 컴포넌트를 만드는 방법은 아래 코드와 같습니다. // Hello.js import React from 'react'; // 1 function Hello() { return Hello React } export default Hello; 이제 Hello.js라는 컴포넌트 파일을 만들었습니다. 이제 Hello.js 컴포넌트를 App.js라는 파일에서 .. 카테고리 없음 2021. 5. 14. 웹 퍼블리셔 입사 1개월차 생존기..!! (210512) 벌써 웹 퍼블리셔로 입사해서 1개월차가 되었습니다. 중고신인으로서 조금 공부를 많이 해야되는 부분이 절실하게 느껴지는 시기가 바로 2주에서 1개월차가 아닐까 싶습니다. 조금 재밌는 것은 현재 파견을 나오게 되었습니다. 우리 식구들도 아직 어색했는데, 파견을 나와서 현재는 혼자 배치가 되어서 더욱 어리둥절하고 있습니다. 현재는 관리자페이지 관련하여 업무가 투입이 되었습니다. 생각보다 많은 부분과 이해관계가 있어서 놀랐습니다. 운영 업무를 했을 때는 관리자 페이지에 대해 쉽게 뚝딱하고 제작될줄 알았는데.. 이제 본격적으로 업무가 들어가고 나서 공격적인 회의(?)부터 폭풍 기획서들을 받으면서 개인적으로 많이 놀랐습니다. 그리고 환경은 리액트 기반으로 진행이 된다고하여, 리액트 공부를 하게 되었습니다. 업무를 .. 웹 퍼블리셔 일기 2021. 5. 13. 이전 1 2 3 4 5 6 다음 💲 추천 글 반응형