김일국의 기술 블로그 누적조회수: / 오늘조회수: / 어제조회수:

[글쓰기] / [관리자]

고정 헤더 영역

글 제목

메뉴 레이어

김일국의 기술 블로그

메뉴 리스트

홈

분류 전체보기 (888)

검색 레이어

김일국의 기술 블로그

검색 영역

컨텐츠 검색

전체 글

eGovFrame X K-PaaS 콜라보 세미나(11.22) 참석 후기

2023.11.22 by 김일국
[리액트+TS] vs [HTML+JS] 에서 외부 라이브러리/모듈 사용비교

2023.11.08 by 김일국
TS-타입스크립트 확장 코딩 패턴

2023.11.02 by 김일국
ES6 vs TS vs 리액트+TS 에서 클래스 사용

2023.10.25 by 김일국
기존 JS vs TypeScript(ES6+TS) 비교

2023.10.20 by 김일국
타입스크립트-TypeScript 전용 타입에 대해서

2023.10.14 by 김일국
TypeScript-타입스크립트의 특징

2023.10.03 by 김일국
리액트-리덕스 향상된 버전인 리덕스js 툴킷 사용 예

2023.10.01 by 김일국

eGovFrame X K-PaaS 콜라보 세미나(11.22) 참석 후기

줌 온라인 세미나 였습니다. - 주제: 개발PC에 K-PaaS 설치 후 EGOV 앱 배포 - 사전지식: 개방형클라우드플랫폼센터는 K-PaaS가 설치된 환경에서 앱개발자가 컨테이너 생성관리 - 사용환경 : CF(Cloud Foundry), k8s(Kubernetes), 젠킨스(Jenkins) 등등 사용 - 참고사항 : 현재 K-PaaS 6.5버전 까지 개발됨 - 1교시와 2교시로 나누어 진행 되었습니다. 아래는 요약한 내용 입니다.(아래) ----------------------------------------------------------------------------------------------------------------- #1교시: 컨테이너플랫폼(k8s) : 쿠버네티스 기반 앤서블스크립트..

클라우드+마이크로서비스 2023. 11. 22. 21:13

[리액트+TS] vs [HTML+JS] 에서 외부 라이브러리/모듈 사용비교

### UI화면 이미지 슬라이드를 외부 모듈/라이브러리로 이용해 본다. - 참고로, 니보슬라이더와 같은 여러 기능이 묶여진 모듈을 번들 모듈이라고 한다. --------------------------------------------------------------------------------------------------------------- 1. 리액트+TS 에서 react-nivo-slider(니보슬라이드)라는 라이브러리를 가져와서 구현해 본다. - 스택비즈의 리액트TS 에서 실습 : https://stackblitz.com/?starters=frontend ---------------------------------------------------------------------------..

노드js·자바스크립트 2023. 11. 8. 18:07

TS-타입스크립트 확장 코딩 패턴

Ps. 아래 타입스크립트의 코딩 패턴을 확인해 보면, 자바(서버프로그램언어)8 버전과 동일한 것을 알 수 있다. 참고로, Java8은 객체지향 언어로 람다식(->애로우함수), 네임스페이스, 제네릭타입, 싱글톤 사용이 가능하다. 즉, 저 처럼 자바(스프링) 개발자에게 진입장벽이 낮은 개발언어가 TypeScript 언어라고 할 수 있다.^^ 참고로, 요즘 코딩 트렌드는 Class(클래스) 기반보다는 Function(함수)기반 으로 리액트+TS 프로그램을 구현하는 경우가 많기 때문에 상대적으로 클래스 기술이 코딩 전면에 나타나는 경우가 줄어 들고 있다. 참고로, 자바(오라클-클래스)기반도 코틀린(구글-함수)기반으로 변환 할 수 있는데, 개발자에겐 자바(클래스)기반이 더 코드를 이해하는 방식이 직관적이기 때문에..

노드js·자바스크립트 2023. 11. 2. 13:05

ES6 vs TS vs 리액트+TS 에서 클래스 사용

------------------------------------------------------------------------------------------------------------ 1. ES6 클래스 vs TS Class 기본비교 : 코드펜 에서 실습 https://codepen.io/pen/ ------------------------------------------------------------------------------------------------------------ #1) ES6부터 클래스 문법을 사용할 수 있다. 클래스를 정의하고, 속성을 설정하는 기본 사용법은 다음과 같다.(아래) /* 클래스 기본서식 ------------------------------------..

노드js·자바스크립트 2023. 10. 25. 15:17

기존 JS vs TypeScript(ES6+TS) 비교

### TS타입스크립트 실행환경에서 지원하는 ES6엑마스크립트기능을 JS와 비교하면서 확인(아래) - 실습환경 : 코드펜 ( https://codepen.io/ ) - 사전지식(JS(ES5) vs ES6 비교 글) : https://kimilguk.tistory.com/838 --------------------------------------------------------------------------------------------------------------------------------------- #### 블록 영역 변수, 상수 선언 : 코드펜에서 실습(아래 https://codepen.io/pen/ ) ----------------------------------------------..

노드js·자바스크립트 2023. 10. 20. 11:34

타입스크립트-TypeScript 전용 타입에 대해서

### 기존JS자바스크립트 말고, TS타입스크립트에서 지원하는 데이터 타입Type들(아래) - 실습환경 : typescript 플레이그라운드 ( https://www.typescriptlang.org/ ) --------------------------------------------------------------------------------------------------------------------------------------- #### enumerate 열거형 자료 : 타입스크립트 플레이그라운드에서 실습(아래 https://www.typescriptlang.org/play ) --------------------------------------------------------------..

노드js·자바스크립트 2023. 10. 14. 14:48

TypeScript-타입스크립트의 특징

### 타입스크립트의 특징 ---------------------------------------------------------------------- * 변수의 데이터 형을 지정한다. * 데이터 형태를 컴파일 시 검사해 주기 때문에 안정된 코딩을 할 수 있다. * 에디터 창에서 정확한 에러 메세지를 보여준다. 일반적인JS에서는 타입이 지정되어 있지 않아 문자 입력하는 자리에 숫자를 입력해도 문제가 되지 않는다(아래) * 코드펜( https://codepen.io/ )의 js 와 typescript( https://www.typescriptlang.org/ ) 의 ts 소스 비교 및 결과(아래) // 타입스크립트에서 문자열 자르기 함수(아래) function sliceText(text:string, l..

노드js·자바스크립트 2023. 10. 3. 17:40

리액트-리덕스 향상된 버전인 리덕스js 툴킷 사용 예

### 리덕스 업데이트버전인 리덕스js 툴킷 사용 예: - 기존 리덕스의 핵심키워드(아래) : action(구현함수내에 사용할 액션분기와 state변경값), reducer(구현함수), dispatch(구현함수호출) - 실습환경: 코드샌드박스 https://codesandbox.io/s/react-new - 우선 리덕스js 툴킷 라이브러리 설치 : npm install @reduxjs/toolkit (코드샌드박스에서는 마우스 선택으로 설치 가능하다.아래) - 지난번에 실습한 리덕스 실습 https://kimilguk.tistory.com/841 소스를 기반으로 작업한다.(아래 3개 파일만 수정하면된다.) - 수정1) 리덕스의 createStore-reducer함수(action) 대신 리덕스js 툴킷의 cr..

노드js·자바스크립트 2023. 10. 1. 19:09

추가 정보

인기글

최신글

페이징

1 ··· 5 6 7 8 9 10 11 ··· 111

TISTORY

김일국의 기술 블로그 © Magazine Lab [상단으로]

페이스북

트위터

인스타그램

유투브

티스토리툴바