일상 :1년차 병아리 개발자 2018년 회고 | 회고에 앞서.. 올해 2018년은 병역특례를 시작하면서, 처음 개발자로 발을 내딛은 해였습니다. 또 학교에서 듣는 수업을 듣고 과제를 하는게 아니라, 사회에 나와서 개발자로 일하는 만큼 많은 점들이 낯설었고, 또한 여러 결정들을 하고 책임들을 가져야 하는 부분들을 겪으며 힘들었던 적도 많았고, 또 그러한 만큼 뿌듯했던 적도 많았습니다. 그만큼 제게 많은 일들이 올해 일어났던 것 같습니다. 그리고 처음 개발자로 발을 내딛는 해였던 만큼, 더 알차게 보내고 싶었고, 어떻게 하면 좋은 개발자로써 성장할 수 있을까, 이시점에서 어떠한 공부를 해야 훗날 내게 도움이 될까 등등 유난히 많은 생각을 했던 올 한해였고 이러한 올 한해를 헛되이 보내지 않기 위해 치열하게 ..
Web:시맨틱 웹 낱낱이 파헤치기 + React.Fragment 에 쓰인 시맨틱 개념 | 시작하기에 앞서 팀 버너스리, 차세대 웹 - TED 강연 (웹에서의 데이터) https://www.ted.com/talks/tim_berners_lee_on_the_next_web?language=ko#t-397419 (7분 40초 ~9분 40초) | Semantic web? Semantic Tag? > Definition 시맨틱 웹은 직역하면 의미론적인 웹 입니다. 즉, 문서의 이미에 맞게 어플리케이션의 의미에 맞게 구성 된 웹입니다.컴퓨터가 사람을 대신하여 정보를 읽고, 이해하고 가공하여 새로운 정보를 만들어 낼 수 있도록 이해하기 쉬운 의미를 가진 차세대 지능형 웹. 또한 다른 의미로는 정보를 분석하여 그 정보..
React:Taste the principles of functional programming in React 이 글은 원작자 David Kopal의 허락을 맡고 https://www.codinglawyer.io/posts/taste-the-principles-of-fp-in-react 를 번역한 글입니다. (본인이 의역한것도 있으므로, 잘못된 번역 피드백 주시면 감사하겠습니다! 감사합니다) 지속가능한 컴포넌트 구조는 안정적인 react application을 개발할때, 선행되어야하는 필수요건입니다. 이러한 것은 higher-order-components (HoCs) 고차 컴포넌트를 사용하면서, 즉 함수형으로 코드를 짜면서 이뤄낼수 있습니다. 이러한 아이디어는 당신의 컴포넌트에서 로직을 분리하기 위함입니..
Web:Heading Tag(제목 태그)와 검색엔진 최적화의 연관성 | 들어가기에 앞서, 웹을 개발하다 보면, 웹페이지를 구성할때 heading tag를 자주 사용하게 됩니다. 그러나 heading tag의 역할이나 중요성에 대해서 간과하게 되는 경우가 있는데요. 하지만 heading 태그는 페이지의 내용을 보여주는 것 뿐 아니라 검색엔진 최적화에도 큰 영향을 미친다고 합니다. 이를 위해 heading 태그에 대해서 알아봅시다. | Heading tag란? 책을 생각해보면, 책의 내용중 중요한 내용에는 색이나 굵기의 차이를 두기도 하는데요, 이러한 역할을 하는것이 HTML에서의 제목 태그(Heading tag) 입니다. HTML에서 heading tag 는 H1~H6 까지 총 6개 입니다. 크기에도 차이..
Javascript:싱글톤 패턴 (singletone pattern) "자바스크립트 핵심 가이드 라는 책을 읽던중, 모듈 부분에 대해서 학습중에 모듈 패턴을 사용하면, 전역변수 사용을 없앨 수 있고, 이 패턴을 사용하면, 정보은닉과 그 외 다른 좋은 설계 방식을 따를 수 있게 하고, 애플리케이션이나 다른 싱글톤 패턴들을 효과적으로 캡슐화 할 수 있게 한다" 는 부분이 나왔습니다. 싱글톤 패턴에 대해서는 어렴풋이 알고 있어, 이 기회에 제대로 알아보기 위해 학습을 해보았습니다. | 싱글톤이란? 싱글톤 패턴은 전체 시스템에서의 하나의 인스턴스만 존재하도록 보장하는 객체 생성패턴이라고 합니다.따라서, 객체 리터럴도 모두 싱글톤 패턴이라고 할 수 있다고 합니다.또한 싱글톤은 특정 클래스의 인스턴스를 오직 하나만..
React:리액트에서의 shallow compare부터 React.PureComponent 까지 | 상황 this.state = { someValue: true }; this.setState({ someValue: true });리액트를 사용하여 개발할때, 위와 같은 상황에서는, setState는 무조건적으로 state를 업데이트하게 되고, 그에 따른 불필요한 렌더링을 하게 됩니다. 따라서 이를 방지하기 위해, 아래와 같이 1. React.PureComponent2. shouldComponentUpdate 주기를 기존 클래스컴포넌트에 추가 를 적용시켜 문제를 해결할수 있습니다. | Shallow compare란?shallow compare는 equality를 체크하는것입니다.숫자나 문자열 같은 sca..