프론트엔드5 프론트엔드 개발자가 왜 UI/UX를 알아야 합니까? 본격, 프론트엔드 개발자가 UI/UX를 공부해야 하는 이유를 스스로 납득하기 위해 쓰는 글 ✍🏻 0. 이 글을 쓰게 된 계기 개발자는 코딩을 잘해야 하는 거 아닌가? 기획은 기획자가, 디자인은 디자이너가 해야지 이번주 부트캠프 수업에서는 UI와 UX에 대해 다루었고, 피그마를 활용해 웹사이트를 클론해 보았다. 사실 전자는 어느 정도 알아야 하는 이유를 스스로 납득했지만, 후자는 아직도 잘 납득이 되지 않았다. '가뜩이나 개발만 해도 공부할 거리가 넘쳐 하루하루 우선순위 높은 공부만 쳐내기에도 바쁜데 웬 디자인'이라는 생각이 들어 실습 중 현타가 왔기 때문이다. 개인적으로 일이나 공부를 할 때 그것을 해야 하는 이유가 납득이 되지 않으면 몰입에 방해가 되기 때문에, 이번 기회에 어차피 해야 하는 거 아예 .. 2023. 4. 16. JavaScript 객체 기초 개념 - 구분, 조회, 객체 다루기 1. 객체란? 자, 배열을 배웠다면 이제 객체를 배울 시간이다. 비유하자면, JavaScript에서의 객체는 게임 캐릭터와 비슷하다고 할 수 있다. 사용자들의 캐릭터는 동일하게 직업과 능력을 가지고 있지만, 각각 세부적인 내용은 다르다. 누군가는 Ella라는 ID와 마법사라는 직업을 가지고 있지만, 다른 누군가는 Chloe라는 ID와 전사라는 직업을 가지고 있다. 마찬가지로 사용자가 웹사이트에 가입할 때 입력할 항목은 모두 같지만, 입력하는 정보는 사용자마다 다르다. 이렇게 각기 다른 값을 가질 수 있지만, 입력해야 하는 데이터의 종류가 동일한 경우 객체를 사용하면 손쉽게 데이터를 관리할 수 있다. 이렇듯, 공통적인 속성을 가지는 경우 객체를 사용해야 한다. 웹사이트에 가입한 회원 주소록을 만든다고 가정.. 2023. 3. 1. HTML의 속성 이름과 속성 값의 차이는 무엇일까? 아래의 코드를 통해 HTML의 기초적인 구조를 알아보자. 1. 이 중 HTML 태그는 아래 두 가지다. HTML 요소의 태그는 보통 opening tag와 closing tag로 구성되어, 태그 사이에 컨텐츠를 넣어 구조를 표현한다. 여기서 주의할 점은 위에 표시 ‘HTML 요소’ 전체가 HTML 요소라고 판단하면 안 된다. 2. 이 중 HTML 속성 이름 (attribute name)은 ‘class’ 다. HTML의 속성(attribute)은 크게 두 가지로 구성되는데, 위의 이미지에서 속성 이름(attribute name)은 ‘class’ 다. 이는 속성 값(attribute value)인 ‘paragraph’와 분명히 구분되어야 한다. attribute name: 속성 이름 attribute val.. 2023. 2. 27. HTML, CSS, JavaScript 차이점 간단히 알아보기 웹 페이지 제작을 집을 만든다고 가정해 봅시다. 1. HTML (Hyper Text Markup Language) 웹 페이지의 구조를 짜는 마크업 언어다. 집을 짓기 위해 도면을 그린다고 생각하면 된다. 마크업 언어란? 태그는 원래 텍스트와는 별개로 원고의 교정부호나 주석을 표현하기 위한 것이었으나, 용도가 점차 확장되어 문서의 구조를 표현하는 역할을 하게 되었다. 이러한 태그 방법의 체계를 마크업 언어라고 하는데, 일반적으로 데이터를 기술하는 정도로만 사용 되기 때문에 자바스크립트와 같은 프로그래밍 언어와는 구별된다. (참고: 위키피디아) 예를 들어, 웹사이트 상의 로그인 페이지를 만든다고 해보자. 그렇다면 기본적으로 아이디와 비밀번호를 입력할 수 있는 입력폼이 필요하겠다. 또한 로그인으로 이어지는 버.. 2023. 2. 27. 개발자로서의 첫 걸음: 학습과 몰입을 위해 필요한 것들 개발자로서의 커리어를 시작하기 위해 코드스테이츠 부트캠프에 지원했고, 운이 좋게 합격했다. 첫 날은 커리큘럼과 학습 방법에 대한 오리엔테이션을 진행했다. 멘토님의 말을 빌리자면, 오늘 내용은 부트캠프에서 잘 살아남을 수 있는 생존 방법 같은 이야기 였는데 그 중 공유할만한 것들을 적어본다. 자기주도적 학습 코드스테이츠에서는 모든 내용을 실시간으로 강의하며 떠먹여 주는 것이 아니라, 가이드라인과 같은 자료를 제공하고 과제를 수행하도록 한다. 이 가운데에서 필요한 건 각자가 얼마나 메타인지를 가지고 손으로 직접 해보며, 모르는 것은 검색 및 질문하고 스스로 해결할 수 있도록 한다. 즉, 물고기를 던져주는 것이 아니라 물고기를 잡는 방법을 알려주는 것이다. 메타인지 메타인지란, 내 머릿속의 거울을 통해 자기 .. 2023. 2. 27. 이전 1 다음
