전체 글(46)
-
쇼핑몰 클론하기(1) 1주차! 모래성이 무너졌다!!!
시작 쇼핑몰 클론하기 프로젝트는 알고리즘 스터디 팀원들과 함께 0816~0830동안 노멜렛이라는 쇼핑몰 사이트를 HTML, CSS, Javascript를 통해 클론한다. 처음으로 배운 걸 써먹는 프로젝트인만큼 아주 멋진 성을 짓고 싶었지만!!! 1주차 결과 어림도 없었다. 나는 아주 더러운 코드를 짰었다... 사이트는 얼추 비슷해보였지만 코드를 보면 아주 엉망이었다!! ㅠㅠ HTML을 작성하며 공통적인 부분을 복사, 붙여넣기 했더니 일부 수정할 때마다 고쳐야 했다. class와 id명이 많아질수록 헷갈렸고, HTML 레이아웃과 동시에 CSS를 작성하니 문제점을 찾기 어려웠고 display에 grid, flex 등등 온갖 css 속성이 섞였다. 하하... 겉으로 보기에는 조금은 괜찮아 보일지도...라고 생..
2022.08.28 -
[Github] commit의 중요성과 reset의 위험성
에러 상황! 협업 과정에서 각자의 깃허브 브랜치에 push 후 PR보내기로 했다. 그렇지만 git checkout 브랜치명을 통해 브랜치를 바꾸고 push하려 했지만 다음과 같은 에러가 떠서 해결을 하고자 알아봤다.. error: you need to resolve your current index first README.md: needs merge 해결 시도와 문제의 시작! 이 블로그를 확인해서 git reset --merge를 누르고 해맑게 push를 하려했다. ㅎ........... 어.... 어디 갔지......? 커밋을 미리미리 안해놓고 이번에 몰아서 했었었는데...... 만약에 커밋을 변경할 때마다 해놨더라면 다 날라가진 않았을텐데.... 쇼핑몰 클론 언제 다시 다하지...? 배운 점과 다짐 ..
2022.08.25 -
<원티드>를 figma로 클론해보자! (2)
상단은 나, 하단은 페어님이 맡으셨다! 배운 점 및 어려웠던 점! 캐러셀 패턴을 사용해보았다. 유튜브에서 참고해서 만들어보았다! 다양한 기능을 구현할 수 있어 재밌어 보이긴 했지만, 직접 자바스크립트로 코딩을 했을 때는 어떤 모습일지 더 궁금했다! 파일, 폴더명의 중요성! 보여주기 부끄럽지만 클론에 사용했던 레이어이다. 기능별로 묶어놓지 않았고, 이미지와 도형에 명확한 이름을 달지 않다 보니, Lo-fi로 작업 후 Hi-fi로 변경하는 과정에서 이게 뭐지? 어떤 걸 수정해야 하지? 하면서 진행했다. 지금 진행하고 있는 쇼핑몰 클론에서도 css를 작성하면서 작성했던 위치를 찾기 어려웠었다. 개인 작업 뿐만 아니라 협업을 위해서라도 규칙을 정하고 나중에 수정하기 쉽도록 작성해야겠다고 생각했다!
2022.08.25 -
<원티드>를 figma로 클론해보자! (1)
어쩌다 원티드 원티드라는 사이트는 페어님이 소개해주셨다! 그 전에 내가 생각하던 목록은 OKKY, 잡플래닛, 인프런 등이었다! 원티드를 분석해보자! 디자인 원티드 사이트에서 인상적이었던 것은 직관적이고 미니멀한 디자인이었다. 태그와 슬라이드를 이용해서 직관적으로 카테고리를 넘어갈 수 있었다. 도움말 및 설명 문서 hover 이벤트가 발생했을 때, "관심 태그를 등록하시면 이벤트가 오픈되는 즉시 카카오톡으로 알려드릴게요"라는 설명이 뜬다. 버튼을 눌렀을 때 팝업창으로 볼 수 있다. 직관적으로 동작해서 좋았다. 피그마는 어때 사실 이전에 어도비 XD로 프로토타이핑을 진행해봤었고, 이번 수업의 일환으로 figma를 배우게 되었다. 플러그인 연동 덕분에 보다 편하게 느껴졌다. 최근 HTML, CSS, javas..
2022.08.25 -
프론트엔드 개발자 지망생에게 UI/UX란?
UI, UX란? UI(User Interface, 사용자 인터페이스)는 사람들이 컴퓨터와 상호 작용하는 시스템을 의미한다. UX(User Experience, 사용자 경험)의 사전적 의미는 사용자가 어떤 시스템, 제품, 서비스를 직•간접적으로 이용하면서 느끼고 생각하는 총체적 경험을 의미한다. UI와 UX에 대해서 이 그림 하나로 설명이 되어버렸다. 프론트엔드 개발자에게 UI, UX란 어떤 의미일까? 한 사이트를 참고하면 UI/UX디자이너는 UI를 디자인하고, 퍼블리셔는 디자이너가 그려준 걸 화면에 코드로 그리고, 프론트엔드는 뒷단 서버 개발을 고려하며 코드를 짠다고 한다. 프론트엔드 개발자가 되기 위해 공부하며, 어떤 개발자가 되어야 할지 늘 고민하고 있다. 알고리즘 스터디에서 문제를 풀다 보면 가독성..
2022.08.23 -
[20220818] Section2 KPT회고
코드스테이츠를 시작하며 다짐했던 나의 첫 목표 에러를 만났을 때, 해결하고 이를 블로그에 업로드하겠다. 건강 관리에 유념하여 무거운 엉덩이를 만들어보겠다. 정규 시간 외의 공부 시간을 늘려나가겠다. Keep 계속 이어나갈 나 운동 헬스장에서 하는 다양한 근력운동에 재미를 붙여 운동을 가고 있다. 코로나에 걸려 1주는 쉬었지만 앞으로도 꾸준히 해나가고자 한다. 작년 이맘때쯤부터 조금씩 생활습관을 개선하며 9kg가 빠졌는데, 대체 어디가 빠진 것인지 알 수가 없다. 하지만 운동이 주는 재미와 근육통의 뿌듯함 ㅎㅎ... 더 건강해져서 내 몫의 일을 해낼 수 있는 체력을 얻어낼 것이다. 알고리즘 스터디 알고리즘 스터디를 진행하고 있다. 매주 함께 백준 문제에 이어 프로그래머스 문제도 풀어보는 중! 아직은 부족하..
2022.08.18