I want to be good developer

Tag

svelte

svelte 공식 사이트 Tutorial 정리 ⑫ : Actions

1 분 소요

Action 엘리먼트 레벨의 라이프사이클 함수입니다. 다음과 같은 경우에 유용하다. 타사 라이브러리와의 인터페이스 지연 로딩되는 이미지 툴팁 사용자 정의 이벤트 핸들러 추가

svelte 공식 사이트 Tutorial 정리 ⑧ : Store

2 분 소요

Store 어플리케이션 계층 구조에 속하지는 않지만, 때때로 다양하고 연관없는 component 또는 일반적인 javascript 모듈에서 접근 가능한 값이 필요할 수가 있다. svelte에서는 store라는 module이 이러한 기능을 제공해준다. 한마디로 여러개의 co...

svelte 공식 사이트 Tutorial 정리 ⑦ : Lifecycle

1 분 소요

Lifecycle 모든 컴포넌트는 생성되면서 시작되고, 소멸될때 끝나는 Lifecycle을 가진다. 이러한 Lifecycle 순간에 실행할 수 있는 함수를 svelte에서 제공한다.

1단계 개발환경 구축

1 분 소요

목표 IntelliJ 설치(Visual Studio Code 가능 - 유용한 기능 사용의 차이만 존재) nodeJS설치 svelte 프로젝트 설치

MicroFrontend 구현 프로젝트!

최대 1 분 소요

프로젝트 목표 각 컴포넌트를 라이브러리화 한다. 해당 컴포넌트 라이브러리를 사용해서 페이지를 구성한다. 해당 페이지들을 모아 TASK(단계)를 구성하여 라이브러리화 한다. 각 TASK들이 모여 SPA방식으로 돌아가는 Process를 구성한다. 이때 TASK들의 ...

맨 위로 이동 ↑

front-end

svelte 공식 사이트 Tutorial 정리 ⑫ : Actions

1 분 소요

Action 엘리먼트 레벨의 라이프사이클 함수입니다. 다음과 같은 경우에 유용하다. 타사 라이브러리와의 인터페이스 지연 로딩되는 이미지 툴팁 사용자 정의 이벤트 핸들러 추가

svelte 공식 사이트 Tutorial 정리 ⑧ : Store

2 분 소요

Store 어플리케이션 계층 구조에 속하지는 않지만, 때때로 다양하고 연관없는 component 또는 일반적인 javascript 모듈에서 접근 가능한 값이 필요할 수가 있다. svelte에서는 store라는 module이 이러한 기능을 제공해준다. 한마디로 여러개의 co...

svelte 공식 사이트 Tutorial 정리 ⑦ : Lifecycle

1 분 소요

Lifecycle 모든 컴포넌트는 생성되면서 시작되고, 소멸될때 끝나는 Lifecycle을 가진다. 이러한 Lifecycle 순간에 실행할 수 있는 함수를 svelte에서 제공한다.

비동기처리, Promise, Async & Await

2 분 소요

비동기처리 특정 코드의 연산이 끝날 때까지 코듸의 실행을 멈추지 않고 다음 코드를 먼저 실행하는 자바스크립트의 특성 예시) ajax, setTimeout

이벤트, 이벤트 핸들러, 이벤트 리스너

최대 1 분 소요

이벤트 HTML events : HTML events are “things” that happen to HTML elements. → HTML 구성요소들에게 발생하는 것들 HTML allows event handler attributes, with JavaScript co...

맨 위로 이동 ↑

ncloud

1단계 개발환경 구축

1 분 소요

목표 IntelliJ 설치(Visual Studio Code 가능 - 유용한 기능 사용의 차이만 존재) nodeJS설치 svelte 프로젝트 설치

MicroFrontend 구현 프로젝트!

최대 1 분 소요

프로젝트 목표 각 컴포넌트를 라이브러리화 한다. 해당 컴포넌트 라이브러리를 사용해서 페이지를 구성한다. 해당 페이지들을 모아 TASK(단계)를 구성하여 라이브러리화 한다. 각 TASK들이 모여 SPA방식으로 돌아가는 Process를 구성한다. 이때 TASK들의 ...

맨 위로 이동 ↑

sveltekit

1단계 개발환경 구축

1 분 소요

목표 IntelliJ 설치(Visual Studio Code 가능 - 유용한 기능 사용의 차이만 존재) nodeJS설치 svelte 프로젝트 설치

MicroFrontend 구현 프로젝트!

최대 1 분 소요

프로젝트 목표 각 컴포넌트를 라이브러리화 한다. 해당 컴포넌트 라이브러리를 사용해서 페이지를 구성한다. 해당 페이지들을 모아 TASK(단계)를 구성하여 라이브러리화 한다. 각 TASK들이 모여 SPA방식으로 돌아가는 Process를 구성한다. 이때 TASK들의 ...

맨 위로 이동 ↑

javascript

비동기처리, Promise, Async & Await

2 분 소요

비동기처리 특정 코드의 연산이 끝날 때까지 코듸의 실행을 멈추지 않고 다음 코드를 먼저 실행하는 자바스크립트의 특성 예시) ajax, setTimeout

이벤트, 이벤트 핸들러, 이벤트 리스너

최대 1 분 소요

이벤트 HTML events : HTML events are “things” that happen to HTML elements. → HTML 구성요소들에게 발생하는 것들 HTML allows event handler attributes, with JavaScript co...

맨 위로 이동 ↑

nexusRepository

1단계 개발환경 구축

1 분 소요

목표 IntelliJ 설치(Visual Studio Code 가능 - 유용한 기능 사용의 차이만 존재) nodeJS설치 svelte 프로젝트 설치

MicroFrontend 구현 프로젝트!

최대 1 분 소요

프로젝트 목표 각 컴포넌트를 라이브러리화 한다. 해당 컴포넌트 라이브러리를 사용해서 페이지를 구성한다. 해당 페이지들을 모아 TASK(단계)를 구성하여 라이브러리화 한다. 각 TASK들이 모여 SPA방식으로 돌아가는 Process를 구성한다. 이때 TASK들의 ...

맨 위로 이동 ↑

sveltkit

맨 위로 이동 ↑

back-end

맨 위로 이동 ↑

jekyll

Jekyll kramdown 마크다운 line번호 넣기

최대 1 분 소요

kramdown 설명 블로그 초보의 입장에서 퍼와서 만든 jekyll 블로그 설정상 markdown conversion이 kramdown으로 되어 있다면, kramdown의 설정에서 highligher 기능으로 line_number를 아래와 같이 줄 수 있다.

Jekyll config 설정

최대 1 분 소요

Jekyll config 설정시 주의사항 config 설정할때 tab여부도 중요하다. 가령 breadcrumbs에 true값을 설정하려고 하였는데, 앞에 1칸 tab이 있어서 설정이 제대로 먹히지 않는 현상이 있었다. 왜 안됨??ㅠㅠ

맨 위로 이동 ↑

faith

맨 위로 이동 ↑

QT

맨 위로 이동 ↑

이사야

맨 위로 이동 ↑

cloud

맨 위로 이동 ↑

microFrontend

1단계 개발환경 구축

1 분 소요

목표 IntelliJ 설치(Visual Studio Code 가능 - 유용한 기능 사용의 차이만 존재) nodeJS설치 svelte 프로젝트 설치

MicroFrontend 구현 프로젝트!

최대 1 분 소요

프로젝트 목표 각 컴포넌트를 라이브러리화 한다. 해당 컴포넌트 라이브러리를 사용해서 페이지를 구성한다. 해당 페이지들을 모아 TASK(단계)를 구성하여 라이브러리화 한다. 각 TASK들이 모여 SPA방식으로 돌아가는 Process를 구성한다. 이때 TASK들의 ...

맨 위로 이동 ↑

ruby

RUBY 사용법

최대 1 분 소요

RUBY 로컬 서버 구동 해당 프로젝트에 가서 1 bundle exec jekyll serve 입력 하면 localhost:4000 포트로 확인 가능

맨 위로 이동 ↑

html

맨 위로 이동 ↑

css

맨 위로 이동 ↑

nomad

맨 위로 이동 ↑

oracle

’<>, !=’와 NVL

1 분 소요

실수 상황 강효형은 수신상품 가입 진행중 중단된 고객 수를 추출하려고 하였다. 그런데, 쿼리 조회시 생각보다 수치가 너무 적게 나왔다. 이유는 무엇일까?

맨 위로 이동 ↑

DB

’<>, !=’와 NVL

1 분 소요

실수 상황 강효형은 수신상품 가입 진행중 중단된 고객 수를 추출하려고 하였다. 그런데, 쿼리 조회시 생각보다 수치가 너무 적게 나왔다. 이유는 무엇일까?

맨 위로 이동 ↑

web

쿠키와 세션

1 분 소요

HTTP(Hypertext Transfer Protocol)이란? 쿠키와 세션을 이해하기 위해서는 이 개념이 등장한 배경을 이해해야한다. 생활코딩님이 강의에서 드신 예시가 적절할 것 같다.

맨 위로 이동 ↑

cookies

쿠키와 세션

1 분 소요

HTTP(Hypertext Transfer Protocol)이란? 쿠키와 세션을 이해하기 위해서는 이 개념이 등장한 배경을 이해해야한다. 생활코딩님이 강의에서 드신 예시가 적절할 것 같다.

맨 위로 이동 ↑

session

쿠키와 세션

1 분 소요

HTTP(Hypertext Transfer Protocol)이란? 쿠키와 세션을 이해하기 위해서는 이 개념이 등장한 배경을 이해해야한다. 생활코딩님이 강의에서 드신 예시가 적절할 것 같다.

맨 위로 이동 ↑

ajax

aJax통신

1 분 소요

HTTP(Hypertext Transfer Protocol)이란? 쿠키와 세션을 이해하기 위해서는 이 개념이 등장한 배경을 이해해야한다. 생활코딩님이 강의에서 드신 예시가 적절할 것 같다.

맨 위로 이동 ↑

jquery

aJax통신

1 분 소요

HTTP(Hypertext Transfer Protocol)이란? 쿠키와 세션을 이해하기 위해서는 이 개념이 등장한 배경을 이해해야한다. 생활코딩님이 강의에서 드신 예시가 적절할 것 같다.

맨 위로 이동 ↑

vim

Vim사용법

2 분 소요

Vim 제대로 가르쳐 줌(개발자라면 한번쯤 꼭 쓴다는 Vim)

맨 위로 이동 ↑

kramdown

Jekyll kramdown 마크다운 line번호 넣기

최대 1 분 소요

kramdown 설명 블로그 초보의 입장에서 퍼와서 만든 jekyll 블로그 설정상 markdown conversion이 kramdown으로 되어 있다면, kramdown의 설정에서 highligher 기능으로 line_number를 아래와 같이 줄 수 있다.

맨 위로 이동 ↑

network

네트워크 주요 포트

1 분 소요

포트란? 컴퓨터가 각종 신호 또는 정보 등을 주고 받을 수 있도록 해주는 통신 통로

맨 위로 이동 ↑

port

네트워크 주요 포트

1 분 소요

포트란? 컴퓨터가 각종 신호 또는 정보 등을 주고 받을 수 있도록 해주는 통신 통로

맨 위로 이동 ↑

event

이벤트, 이벤트 핸들러, 이벤트 리스너

최대 1 분 소요

이벤트 HTML events : HTML events are “things” that happen to HTML elements. → HTML 구성요소들에게 발생하는 것들 HTML allows event handler attributes, with JavaScript co...

맨 위로 이동 ↑

event-handler

이벤트, 이벤트 핸들러, 이벤트 리스너

최대 1 분 소요

이벤트 HTML events : HTML events are “things” that happen to HTML elements. → HTML 구성요소들에게 발생하는 것들 HTML allows event handler attributes, with JavaScript co...

맨 위로 이동 ↑

event-listener

이벤트, 이벤트 핸들러, 이벤트 리스너

최대 1 분 소요

이벤트 HTML events : HTML events are “things” that happen to HTML elements. → HTML 구성요소들에게 발생하는 것들 HTML allows event handler attributes, with JavaScript co...

맨 위로 이동 ↑

Promise

비동기처리, Promise, Async & Await

2 분 소요

비동기처리 특정 코드의 연산이 끝날 때까지 코듸의 실행을 멈추지 않고 다음 코드를 먼저 실행하는 자바스크립트의 특성 예시) ajax, setTimeout

맨 위로 이동 ↑

Async

비동기처리, Promise, Async & Await

2 분 소요

비동기처리 특정 코드의 연산이 끝날 때까지 코듸의 실행을 멈추지 않고 다음 코드를 먼저 실행하는 자바스크립트의 특성 예시) ajax, setTimeout

맨 위로 이동 ↑

Await

비동기처리, Promise, Async & Await

2 분 소요

비동기처리 특정 코드의 연산이 끝날 때까지 코듸의 실행을 멈추지 않고 다음 코드를 먼저 실행하는 자바스크립트의 특성 예시) ajax, setTimeout

맨 위로 이동 ↑

node.js

맨 위로 이동 ↑

Coding Test

맨 위로 이동 ↑