전체 글

프론트엔드 개발자의 성장일기
·Computer Science
안녕하세요. 오늘은 SSO가 무엇인지, 어떠한 원리와 장점들을 가지고 있는 지 알아봅시다! 1. SSO(Single Sign-On)SSO란? 하나의 인증 과정으로 여러 시스템 or 애플리케이션에 접근할 수 있도록 하는 인증 메커니즘이에요.사용자는 한 번 로그인하면, 동일한 인증 정보를 이용해 다른 애플리케이션 or 시스템에 추가 로그인 없이 접근할 수 있습니다.이는 사용자 경험을 개선하고, 보안 관리의 복잡성을 줄이며, 인증 정보를 통합적으로 관리할 수 있게 해줘요. 2. SSO의 특징SSO는 어떠한 특징을 가지고 있는 지 알아봅시다.2-1. 사용자 편의성사용자는 여러 시스템에 로그인할 때마다 별도의 자격 증명을 입력할 필요가 없습니다.한 번 인증이 완료되면, 다른 시스템에서도 자동으로 인증이 유지됩니다..
화면에 나와있는 테이블을 엑셀로 다운로드 받아서 사용하고 싶은 경험이 있으셨을텐데요.JavaScript로 엑셀 다운로드 기능을 구현해봅시다! 1. SheetJS 라이브러리 사용가장 먼저 코드를 작성하기 전에 SheetJS를 설치해 줍시다.(저는 npm을 사용해서 설치해 주었어요.)SheetJS : JavaScript에서 엑셀 파일을 생성하고 다운로드할 수 있는 라이브러리 npm install xlsx ※ 만약, 스크립트로 라이브러리를 추가하고 싶다면, 다음과 같이 입력해 줍니다. 2. 코드 작성하기그러면 이제 html에서 코드를 작성해 봅시다! body 부분에 다운로드 버튼을 만들어 주세요.엑셀 다운로드 그 다음, 엑셀 파일이 다운로드되고 데이터도 정상적으로 나타나는 것을 확인할 수 있어요. 전체 코드e..
이번에는 암호화 및 복호화 모듈인 해시 함수에 대해 알아봅시다! 1. 해시 함수해시 함수란? 입력 데이터를 고정 길이의 해시 값으로 변환하는 암호화 모듈입니다.주로 데이터의 무결성을 확인하거나 비밀번호 저장, 디지털 서명 등에 사용됩니다.해시 함수는 입력 데이터의 크기와 상관없이 항상 같은 길이의 해시 값만 생성하며, 해시 값에서 원래 데이터를 복원할 수 없어요.. 해시 함수의 종류로는 다음과 같이 있습니다. 1-1. MD5(Message-Digest Algorithm)MD5는 입력 데이터를 128bit(16byte)의 해시 값으로 변환합니다.또한, 고정된 32자리의 16진수 문자열로 출력됩니다.하지만, 현재는 보안 취약점으로 인해 비밀번호 저장 or 데이터 무결성 검증 등의 용도로는 사용을 피하는 것이..
프로젝트 도중 저는 현재 시간과 현재시간 + 5분을 비교하는 java 코드를 작성하고자 했습니다.그러기 위해서는 java에서 현재 시간을 나타내는 클래스가 있어야 하는데..구글링을 통해 찾던 도중 제가 원하는 것을 찾았습니다! 1. LocalDateTimeLocalDateTime은 Java 8에서 도입된 날짜와 시간을 다루기 위한 클래스입니다.이 클래스는 시간대 정보를 포함하지 않는 날짜와 시간을 표현해요. 즉, 다른 특정 지역의 시간으로 변환할 필요가 없다는 뜻이죠.또한, LocalDateTime은 불변성입니다. 즉, 한 번 생성된 객체는 변경할 수 없고, 변경이 필요할 경우, 새로운 객체를 생성해야 해요.그리고 날짜와 시간을 쉽게 조작할 수 있는 다양한 메서드를 제공합니다. 예를 들어, 날짜 추가, ..
제가 담당하고 있는 업무에서 Grafana라는 것을 사용하고 있다는 것을 알았습니다.새로 들어본 것이라 생소하지만, 무엇인가 새로 배울 수 있다는 마음에 설레네요.바로 알아보겠습니다! 1. Grafana(그라파나)Grafana란? 데이터 시각화 및 모니터링이 가능한 오픈 소스 도구로, 시스템 모니터링, 애플리케이션 성능 추적, 비즈니스 메트릭 분석 등 다양한 용도로 한눈에 파악하고 분석할 수 있도록 도와줍니다.이 도구는 실시간 데이터를 수집하고 대시보드를 통해 시각적으로 표현하며, 필요 시 경고(알림)을 설정해 문제가 발생하기 전에 조취를 취할 수 있게 합니다.또한, 다양한 데이터 소스와 호환되며, 매우 유연한 구성이 가능해 많은 시스템과 인프라 환경에서 널리 사용되고 있어요. 2. Grafana 기능G..
오픈소스를 분석하던 도중, 신기하게 생긴 코드를 발견했습니다!this.utils = await (() => import('@/utils')() 이런 코드는 처음 보기에 이 코드가 무엇인지 알아보았습니다. 1. 즉시 실행 함수(IIFE, Immediately Invoked Function Expression)즉시실행함수(IIFE)는 정의되자마자 바로 실행되는 함수입니다.코드의 범위를 제한하거나 변수를 보호하기 위해 사용됩니다.이는 내부 변수를 외부에서 접근할 수 없게 하여, 전역 변수를 오염시키지 않으며, 코드의 특정 부분을 독립적으로 실행할 수 있어 모듈화에 유리합니다. 2. 사용방법즉시실행함수의 기본 구조는 다음과 같습니다.(function() { // 실행문})();// or(() => { /..
SQL에서는 여러 종류의 키(key)가 존재해요.이들은 DB 내에서 데이터를 식별하고, 관계를 정의하고, 무결성을 유지하는 데 중요한 역할을 합니다.키를 설정해야 관계형 DB의 구조와 데이터 무결성을 보장할 수 있어요.지금부터 어떤 종류의 key가 있는 지 알아봅시다!. 1. Primary Key(기본 키)Primary Key는 DB에서 각 레코드를 고유하게 식별하는 데 사용됩니다.1-1. 고유성 Primary Key로 지정된 열의 값은 DB 테이블 내에서 고유성을 가져야 합니다.즉, 같은 값이 두 번 나타날 수 없어요.1-2. NULL 불가또한, NULL 값을 가질 수 없어요.모든 레코드는 반드시 Primary Key 값을 가져야 합니다.1-3. 불변성 Primary Key의 값은 변경되지 않아야 합니..
그러면 이번엔 비대칭 키 암호화의 종류에 대해 알아봅시다. (암호화 및 복호화 모듈 정의와 대칭키 암호화란?) 1. 비대칭 키 암호화(Asymmetric Key Encryption)비대칭 키 암호화는 암호화와 복호화에 서로 다른 키(공개키와 개인키)를 사용하는 방식을 뜻해요.데이터를 암호화할 때는 공용 키를 사용하고, 암호화된 데이터를 복호화할 때는 개인 키를 사용합니다.이로 인해, 공용 키를 사용하여 암호화된 데이터는 해당 개인 키를 가진 사람만 복호화할 수 있어요.주요 알고리즘으로는 다음과 같습니다. 1-1. RSA (Rivest–Shamir–Adleman)RSA는 가장 널리 사용되는 비대칭 키 암호화 알고리즘으로, 주로 데이터의 안전한 전송과 디지털 서명에 사용됩니다.RSA의 기본 원리는 두 개의 ..
프로젝트를 하다보면, 어떠한 중요 개인정보를 사용해야 하는 경우가 있는데요.워낙 중요하기에, 이를 암호화하여 사용하거나 복호화하여 읽어들이는 상황이 발생합니다.이러한 상황을 해결하기 위해 Java에서 AES를 사용하는 방법을 알아봅시다! (AES란?) 1. AES를 사용한 Java 코드그럼 본격적으로 AES를 사용하여 Java코드로 작성한 암호화 및 복호화 기능을 만들어 봅시다. import는 다음과 같이 추가해 줍니다.import java.nio.charset.StandardCharsets;import java.util.Base64;import javax.crypto.Cipher;import javax.crypto.spec.IvParameterSpec;import javax.crypto.spec.Sec..
회사 관련 프로젝트를 하던 도중, Java에서 사용자의 id를 암호화로 받아온 뒤, 암호화된 id를 복호화 시키는 작업이 필요했습니다.그러한 과정을 거칠 수 있는 암호화 및 복호화 모듈에 대해 알아봅시다. 1. 암호화 및 복호화 모듈이란?암호화 및 복호화 모듈은 데이터를 보호하고, 기밀성을 유지하며, 무결성을 보장하기 위해 사용되는 도구에요.암호화(Encryption)는 데이터를 이해할 수 없는 형태로 변환하여, 인가되지 않은 사용자가 데이터를 읽지 못하게 하는 과정이며, 복호화(Decryption)는 암호화된 데이터를 원래의 형태로 변환하는 과정입니다. 2. Java 암호화 및 복호화모듈Java에서 암호화 및 목보화 모듈은 일반적으로 javax.crypto 패키지를 통해 수행됩니다.이 패키지는 다양한 ..
회사에서 개발하고 있는 토폴로지에 대해 탐구하던 도중, D3를 알게 되었습니다.매우 흥미로운 라이브러리이기에 이에 대해 알아보려고 합니다. 1. D3D3란 무엇일까요? (D3 공식 홈페이지 바로가기)D3.js는 데이터를 시각적으로 표현하기 위한 JavaScript 라이브러리입니다.D3는 Data-Driven Documents의 약자입니다. 이는 웹 브라우저에서 데이터를 기반으로 동적이고 인터랙티브한 시각화 및 애니메이션을 생성하는 데 사용됩니다.HTML, SVG, CSS와 같은 웹 표준 기술을 사용하여 데이터 시각화를 구축해요. 2. 특징D3의 특징은 다음과 같습니다.1) 데이터 바인딩D3는 데이터를 DOM(Document Object Model) 요소에 바인딩할 수 있어요.이로 인해 데이터에 기반한 그..
AG Grid의 Grid Option은 AG Grid를 설정하고 동작을 제어하는 데, 사용됩니다.저는 ag-gird-vue라는 태그 안에 Grid Option을 사용했어요.Grid Option에는 무엇이 있고 어떤 역할을 하는지 알아봅시다! 1. Grid OptionGrid Option은 다음과 같습니다. (Grid Options 공식 홈페이지 바로가기)옵션설명groupRemoveSingleChildren그룹화된 데이터에서 자식이 하나만 있는 경우, 그룹을 축소화할 지 결정합니다.localeText 텍스트의 언어를 설정합니다. style 그리드의 스타일을 설정합니다. class 그리드의 클래스를 설정합니다. rowData 배열 형태의 데이터를 그리드에 로드합니다. getRowNodeId 주어진 ID를 가..
java로 작업이 되어 있는 오픈소스를 분석하던 도중 신기한 코드를 보았습니다.바로 try문 안에 소괄호가 있는 것인데요!제가 알고 있는 try문은 바로 실행문으로 넘어가는 것인데, 이것이 바로 try-with-resources라고 하네요.이는 무엇인지 궁금하여, 알아보게 되었습니다. 1. try-with-resourcestry-with-resource 구문은 Java 7에서 도입된 기능으로, 리소스를 명시적으로 닫아주는 것이 아니라, 자동으로 닫아주는 구조를 제공한다고 합니다.이를 통해 코드가 더 간결하고 안전해지며, 리소스를 제대로 해제하지 않아 발생할 수 있는 메모리 누수 or 다른 문제를 방지할 수 있습니다. 2. 기본 문법그러면 직접 사용해 보기 전에, 문법이 어떻게 이루어져 있는지 확인해 봅시..
1. 문제 해석csv 파일을 불러와 vue에 모달창으로 사용해야 하는 업무가 있었습니다.회사 관련 코드이기에 자세하게 알려줄 수 없으나, 코드는 다음과 같습니다. upload.javapublic class Controller { @PostMapping("/test") public SingleResponse upload(MultipartFile file) { try { csvService.saveCsv(file); return responseService.createResponse(true); } catch (Exception e) { return responseService.createResponse(e.toS..
데이터허브 관련 업무 도중 엑셀을 불러와서 테이블에 대입하는 기능이 필요했습니다.이 때 사용하는 기능이 BuffredReader인데, 이 것이 무엇인지 모르기에 이번 기회에 알아봅시다! 1. BuffredReaderBuffredReader란? Java에서 텍스트 파일 or 다른 입력 스트림에서 데이터를 효율적으로 읽기 위해 사용되는 클래스입니다. java.io 패키지에 포함되어 있으며, 주로 파일 읽기, 네트워크 통신, 콘솔 입력 등에서 유용하게 사용됩니다. 2. 특징BufferedReader의 특징에 대해 알아봅시다. 먼저 BufferedReader는 내부 버퍼를 사용하여 데이터를 한 번에 읽어들입니다. 이로 인해 I/O 작업의 빈도를 줄이고 성능을 향상시킬 수 있어요.※ I/O : 입력(Input)과..
NewBean
NewBean의 웹과 콩나무