본문 바로가기

전체 글343

[Python] pyenv pyenv is a python version managing tool. Installation On MAC $ brew install pyenv On Windows Previously, we should use a pip. $ pip3 install pyenv-win --target $HOME/.pyenv But, now!!! We can use the chocolatey~!!! YAY~!!! $ choco install -y pyenv-win We no longer have to add environment variables directly !!! Usage Show available list $ pyenv install -l Show installed list $ pyenv versions Show.. 2020. 8. 29.
[CSS] Flexbox Flexbox is the commonly-used name for the CSS flexible box layout model. Flexbox displays a single dimension as a row or a column. flex is a new value added to the CSS display property. Along with inline-flex it causes the elements that it applies to become a flex container, and the element's children to each become a flex item. I will explain the flexbox through the example. This is a default c.. 2020. 8. 28.
[Go] Getting Started (시작하기) ※ 08/28/2020 - v1.15 Installation Official Homepage https://golang.org/dl You can download and install Go through this official website. You can also install Go with package managers. On MAC $ brew install go On Windows I am using Chocolatey. If you use this, you can install Go like this. $ choco install -y golang GOROOT On Windows GOROOT is an installation path of Go. Based on the current versi.. 2020. 8. 28.
[CSS] BEM (Block Element Modifier) Overview BEM is a methodology that helps you to create reusable components and code sharing in web FE development. CSS codes developed without any structure or naming conventions leads to an unmaintainable in the long term. The advantages of BEM are modularity, reusability, and structure. So if we follow the BEM method, it allows us to solve these problems. Block A standalone entity that is mean.. 2020. 8. 28.
[CSS] Pseudo Classes and Pseudo Elements Not all elements have a pseudo classes and pseudo elements. Therefore, you have to carefully use it. Pseudo Classes :active This represents an element that is being activated by the user. :checked This represents any radio, checkbox, or option element that is checked or toggled to an on state. :first-child This represents the first element among a group of sibling elements. :focus This represent.. 2020. 8. 27.
[티스토리] 소스코드 이쁘게 삽입하기 (Feat. highlight.js) 08/26/2020 - v10.1.2 개발용 블로그에는 아무래도 소스코드를 삽입할 일이 많은데 티스토리에서 기본으로 제공하는 것은 별로 맘에 들지 않더라고요. 다크 테마를 좋아해서 소스코드라도 다크 테마를 하고 싶기도 했고요. 이래저래 찾아보니 highlight.js가 여전히 쉽고 편해서 많이 쓰는 거 같더라고요. 그래서 저도 이거를 기반으로 꾸미기로 했습니다 !!! highlight.js의 홈페이지는 다음과 같습니다. https://highlightjs.org/ highlight.js 소개 더보기 먼저 링크에 있는 홈페이지로 갑니다. 노란색 박스로 표시한 Usage를 눌러서 사용법을 확인해 봅시다. 필요한 css파일과 js파일을 설정해주고, hljs.initHighlightingOnLoad() 함수를 .. 2020. 8. 27.
[CSS] Combinators Descendant Combinator The descendant combinator uses space. It selects nodes that are descendants of the first selected element. This is a usage example. div span { color: teal; } Child Combinator The child combinator uses >. It selects a node that is direct children of the first element. This is a usage example. ul > li { font-weight: 700; } Adjacent Sibling Combinator The adjacent sibling comb.. 2020. 8. 26.
[CSS] Basic / Grouping Selector Basic Selectors Universal Selector The * selects all elements. We use this selector for applying some property globally. Here is the usage. * { margin: 0; } Type Selector The type selector selects all elements that have the specified HTML tag name. Here is the usage. div { width: 10px; } span { font-size: 12px; } h1 { color: teal; } ID Selector The ID selector selects an element that has the id .. 2020. 8. 24.
[CSS] Syntax The basic syntax of CSS is like below. selector { property: value; } The selector selects which element of HTML tag. The CSS block is specified by { }. The property means which property is applied to the selected tag. The value means what value is applied to the specified property. The : has to be located between property and value. The ; has to be located after the value. This is the example. d.. 2020. 8. 24.