NewBean의 웹과 콩나무
close
프로필 배경
프로필 로고

NewBean의 웹과 콩나무

  • 분류 전체보기 (499)
    • Programming Language (87)
      • Java (65)
      • C (4)
      • Python (16)
      • R (2)
    • UI & UX (4)
      • Figma (4)
    • Front-End Study (193)
      • HTML+CSS (34)
      • HTML 사전 (6)
      • CSS 사전 (14)
      • Sass (6)
      • 반응형 웹 (8)
      • JavaScript (52)
      • TypeScript (8)
      • React (29)
      • Next.js (9)
      • Angular (1)
      • Vue.js (23)
      • Vite (2)
      • Node.js (1)
    • Back-End Study (101)
      • DBMS (28)
      • Linux (43)
      • Git & GitHub (15)
      • Express (7)
      • Postman (4)
      • REST API (2)
      • PHP (0)
      • Grafana (2)
    • Computer Science (14)
    • 정보처리기사 (76)
      • 1. 요구사항 확인 (1)
      • 2. 화면 설계 (1)
      • 3. 데이터 입출력 구현 (1)
      • 4. 통합 구현 (1)
      • 5. 인터페이스 구현 (1)
      • 6. 프로그래밍 언어 활용 (1)
      • 7. SQL 응용 (1)
      • 8. 서버 프로그램 관리 (1)
      • 9. 소프트웨어 개발 보안 구축 (1)
      • 10. 애플리케이션 테스트 관리 (1)
      • 11. 응용 SW 기초 기술 활용 (1)
      • DB (65)
    • 잡다한 말 (6)
    • 기타 (5)
    • 내가 읽은 책 (5)
    • 없어진 글모음 (7)
  • 홈
  • 방명록
  • 깃허브
  • 포트폴리오
구조 분해 할당(Destructuring assignment)

구조 분해 할당(Destructuring assignment)

오픈 소스 코드를 분석하던 도중, 신기한 코드를 발견했습니다.const { id, name, password, age, address } = state.info 보통 변수 = 값으로 변수를 선언하는 데, 이 코드는 변수명이 여러 개가 존재하고, 값은 하나로 되어 있더군요.이러한 문법을 구조 분해 할당이라고 합니다. 이 문법이 무엇인지 알아보아요! 1. 구조 분해 할당 (Destructuring assignment)구조 분해 할당이란? 배열 or 객체의 속성을 쉽게 수출하여 변수에 할당하는 JavaScript 문법입니다.이를 통해 코드를 간결하고 직관적으로 작성할 수 있어요. 2. 배열에서의 구조 분해 할당배열에서 구조 분해 할당을 사용하면 배열의 요소들을 각각 변수로 쉽게 할당할 수 있어요. exampl..

  • format_list_bulleted JavaScript
  • · 2024. 10. 18.
  • textsms
Vue.js의 생명주기(Lifecycle)

Vue.js의 생명주기(Lifecycle)

Vue.js의 생명주기에 대해 자세히 알아봅시다!  1. Vue.js의 생명주기(Lifecycle)Vue.js의 생명주기는 컴포넌트가 생성되고 소멸될 때까지 발생하는 일련의 단계를 의미해요.Vue 컴포넌트는 각 단계마다 특정한 생명주기 훅(Lifecycle hook)을 호출할 수 있으며, 이를 통해 특정 단계에서 로직을 실행하거나 상태를 관리할 수 있어요.  2. Vue.js 생명주기 단계생명주기 단계는 다음 그림과 같이 순서대로 나뉘어 있습니다. 그러면 한 단계씩 알아봅시다. 2-1. beforeCreate (생성 전)beforeCreate는 Vue 인스턴스가 초기화되기 전 상태입니다.아직 데이터 or 메서드 등이 정의되지 않았기 때문에, 이 단계에서 Vue 인스턴스에 접근할 수 없어요.즉, 컴포넌트의..

  • format_list_bulleted Vue.js
  • · 2024. 10. 16.
  • textsms
LDAP(Lightweight Directory Access Protocol)

LDAP(Lightweight Directory Access Protocol)

LDAP이 무엇인지, 어떤 구조를 가졌으며, 어떻게 사용하는 것인지 알아봅시다! 1. LDAP(Lightweight Directory Access Protocol)LDAP이란? 네트워크에서 사용자, 그룹, 장치 등의 디렉토리 데이터를 관리하고 접근하기 위한 표준 프로토콜이에요.주로 중앙 집중화된 인증 시스템에서 사용되며, 기업 환경에서 사용자 정보 or 권한을 관리하는 데 중요한 역할을 합니다.LDAP은 TCP/IP 기반의 프로토콜로, 다양한 플랫폼에서 널리 사용되고 있어요.TCP/IP : 인터넷과 네트워크 통신에서 데이터를 전송하기 위한 프로토콜의 집합(TCP : 신뢰성 있는 데이터 전송, IP : 데이터를 목적지로 전달) 2. 특징LDAP의 주요 특징은 다음과 같아요. 2-1. 디렉터리 구조LDAP은..

  • format_list_bulleted Computer Science
  • · 2024. 10. 16.
  • textsms
SSO(Single Sign-On)

SSO(Single Sign-On)

안녕하세요. 오늘은 SSO가 무엇인지, 어떠한 원리와 장점들을 가지고 있는 지 알아봅시다! 1. SSO(Single Sign-On)SSO란? 하나의 인증 과정으로 여러 시스템 or 애플리케이션에 접근할 수 있도록 하는 인증 메커니즘이에요.사용자는 한 번 로그인하면, 동일한 인증 정보를 이용해 다른 애플리케이션 or 시스템에 추가 로그인 없이 접근할 수 있습니다.이는 사용자 경험을 개선하고, 보안 관리의 복잡성을 줄이며, 인증 정보를 통합적으로 관리할 수 있게 해줘요. 2. SSO의 특징SSO는 어떠한 특징을 가지고 있는 지 알아봅시다. 2-1. 사용자 편의성사용자는 여러 시스템에 로그인할 때마다 별도의 자격 증명을 입력할 필요가 없어요.한 번 인증이 완료되면, 다른 시스템에서도 자동으로 인증이 유지됩니다..

  • format_list_bulleted Computer Science
  • · 2024. 10. 10.
  • textsms
엑셀 다운로드 기능 구현하기

엑셀 다운로드 기능 구현하기

화면에 나와있는 테이블을 엑셀로 다운로드 받아서 사용하고 싶은 경험이 있으셨을텐데요.JavaScript로 엑셀 다운로드 기능을 구현해봅시다! 1. SheetJS 라이브러리 사용가장 먼저 코드를 작성하기 전에 SheetJS를 설치해 줍시다.(저는 npm을 사용해서 설치해 주었어요.)SheetJS : JavaScript에서 엑셀 파일을 생성하고 다운로드할 수 있는 라이브러리 npm install xlsx ※ 만약, 스크립트로 라이브러리를 추가하고 싶다면, 다음과 같이 입력해 줍니다. 2. 코드 작성하기그러면 이제 html에서 코드를 작성해 봅시다! body 부분에 다운로드 버튼을 만들어 주세요.엑셀 다운로드 그 다음, 엑셀 파일이 다운로드되고 데이터도 정상적으로 나타나는 것을 확인할 수 있어요. 전체 코드e..

  • format_list_bulleted JavaScript
  • · 2024. 10. 7.
  • textsms
암호화 및 복호화 모듈 - 해시 함수

암호화 및 복호화 모듈 - 해시 함수

이번에는 암호화 및 복호화 모듈인 해시 함수에 대해 알아봅시다! 1. 해시 함수해시 함수란? 입력 데이터를 고정 길이의 해시 값으로 변환하는 암호화 모듈입니다.주로 데이터의 무결성을 확인하거나 비밀번호 저장, 디지털 서명 등에 사용됩니다.해시 함수는 입력 데이터의 크기와 상관없이 항상 같은 길이의 해시 값만 생성하며, 해시 값에서 원래 데이터를 복원할 수 없어요.. 해시 함수의 종류로는 다음과 같이 있습니다. 1-1. MD5(Message-Digest Algorithm)MD5는 입력 데이터를 128bit(16byte)의 해시 값으로 변환합니다.또한, 고정된 32자리의 16진수 문자열로 출력됩니다.하지만, 현재는 보안 취약점으로 인해 비밀번호 저장 or 데이터 무결성 검증 등의 용도로는 사용을 피하는 것이..

  • format_list_bulleted Java
  • · 2024. 10. 4.
  • textsms
  • navigate_before
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • ···
  • 84
  • navigate_next
공지사항
  • 문의 (juv6262@naver.com)
전체 카테고리
  • 분류 전체보기 (499)
    • Programming Language (87)
      • Java (65)
      • C (4)
      • Python (16)
      • R (2)
    • UI & UX (4)
      • Figma (4)
    • Front-End Study (193)
      • HTML+CSS (34)
      • HTML 사전 (6)
      • CSS 사전 (14)
      • Sass (6)
      • 반응형 웹 (8)
      • JavaScript (52)
      • TypeScript (8)
      • React (29)
      • Next.js (9)
      • Angular (1)
      • Vue.js (23)
      • Vite (2)
      • Node.js (1)
    • Back-End Study (101)
      • DBMS (28)
      • Linux (43)
      • Git & GitHub (15)
      • Express (7)
      • Postman (4)
      • REST API (2)
      • PHP (0)
      • Grafana (2)
    • Computer Science (14)
    • 정보처리기사 (76)
      • 1. 요구사항 확인 (1)
      • 2. 화면 설계 (1)
      • 3. 데이터 입출력 구현 (1)
      • 4. 통합 구현 (1)
      • 5. 인터페이스 구현 (1)
      • 6. 프로그래밍 언어 활용 (1)
      • 7. SQL 응용 (1)
      • 8. 서버 프로그램 관리 (1)
      • 9. 소프트웨어 개발 보안 구축 (1)
      • 10. 애플리케이션 테스트 관리 (1)
      • 11. 응용 SW 기초 기술 활용 (1)
      • DB (65)
    • 잡다한 말 (6)
    • 기타 (5)
    • 내가 읽은 책 (5)
    • 없어진 글모음 (7)
최근 글
인기 글
최근 댓글
태그
  • #리눅스
  • #정보처리기사
  • #Vue.js
  • #Git & GitHub
  • #Python
  • #DBMS
  • #JavaScript
  • #react
  • #html+css
  • #Java
전체 방문자
오늘
어제
전체
Copyright © 쭈미로운 생활 All rights reserved.
Designed by JJuum

티스토리툴바

개인정보

  • 티스토리 홈
  • 포럼
  • 로그인

단축키

내 블로그

내 블로그 - 관리자 홈 전환
Q
Q
새 글 쓰기
W
W

블로그 게시글

글 수정 (권한 있는 경우)
E
E
댓글 영역으로 이동
C
C

모든 영역

이 페이지의 URL 복사
S
S
맨 위로 이동
T
T
티스토리 홈 이동
H
H
단축키 안내
Shift + /
⇧ + /

* 단축키는 한글/영문 대소문자로 이용 가능하며, 티스토리 기본 도메인에서만 동작합니다.