궁금한게 많은 열아홉
article thumbnail
[React] 파일 업로드 & 다운로드 기능 구현하기
React&Next.js 2023. 11. 16. 09:39

개요현재 사내에서 진행 중인 프로젝트 CSVtoHex를 개발중이다. 해당 프로젝트는 회사 자제 솔루션 제품에 들어가는 CSV 파일을 Hex로 읽을 수 있는 프로그램을 만드는 것이 목적이다. 프로젝트 기능 명세는 아래와 같으며 오늘 구현했던 것은 CSV 파일 업로드 기능 그리고 변환 없이 다운로드 되는 과정을 구현해보려고 한다.  기능 세부 사항으로 쪼개기우선 이 기능의 목적을 기억하자. 파일을 업로드하는 기능이라는 것. 여러 방법이 있겠지만, 나는 크게 두 가지로 분류했다.파일 업로드 기능 구현하기"업로드" 버튼 혹은 이 기능을 하는 요소를 통해 파일 업로드하기drag&drop을 통해 파일 끌어와서 업로드하기업로드 한 파일 값 보여주기그리고 기본적인 UI를 만들어주었다. ..

article thumbnail
CSV 파일을 JSON으로 만들어서 활용하기
JavaScript 2023. 11. 1. 16:51

개요사내에서 진행 중인 프로젝트에 CSV 파일을 읽어들여서 데이터를 변환하는 프로그램을 제작 중이다. CSV 파일 내용을 가져와서 변환된 모습을 보여주어야 하기 때문에 내가 가장 보편적으로 다루는 형태로 내용을 가지고 있어야만 했다.가장 많이 쓰는 형태, JSON프로젝트를 하면서 가장 많이 쓰이는 데이터 형태가 어떤 형태일지 생각해보니, 객체 형태라는 것이 가장 많이 떠올랐다. 서버로 부터 데이터를 받았을 때도, 혹은 여러 정보를 하나의 객체로 표현할 때도 JSON 모양으로 받아오는 경우가 가장 많았고 이를 사용하기로 했다. 어떤 것을 고려해야할까?해당 파일의 샘플은 아래와 같다. 이 파일의 내용을 문자열 형태로 받을 것이다. 아직 진짜 파일 업로드 기능을 구현한 것은 아니기에, 파일..

article thumbnail
[React+Typescript] 카카오맵 API를 활용하여 덕질지도 완성하기
React&Next.js 2023. 10. 4. 23:05

개요지난 9월 UNITHON 10회차가 끝나고,회고록은 작성했지만 사용했던 기술에 대한 설명이 부족하다고 느껴져 작성하게 되었다.기획서는 여기를 참고하면 될 것 같고,지금부터는 내가 맡은 부분인 지도 부분을 어떻게 활용했는지 작성해보려고 한다. 기능 쪼개기우선 내가 하고자 하는 기능을 하나의 퀘스트를 깬다 생각하고 작성해보았다.그랬더니 아래와 같이 정리할 수 있었다.우리의 주 목적은 지도를 활용해 내 최애가 다녀간 장소,최애의 맛집 혹은 최애의 생일을 축하 할 수 있는 생일 카페에 대한 정보를 제공하는 것이다.나는 이 지도를 활용해 사용자에게 정보를 제공해야한다. 지도를 화면에 띄웁시다!첫 번째, 지도를 화면에 띄우기 위해 지도 API를 활용해야했다.네이버 지도, 구글 지도.. 등 다양한 지도 API가 ..

article thumbnail
[정보보안] 리버싱으로 취약한 프로그램 파일 분석하기 _ 코드엔진RCE1번 문제 풀이
정보보안 2023. 9. 14. 14:28

어셈블리어 기계어와 대응되는 로우 레벨 언어이다. 컴파일이 빠르고 유지보수가 힘들어 거의 사용되지 않지만 하드웨어 디버깅을 할 때 유용하게 사용됨. 레지스터 소량의 데이터, 처리중인 중간결과를 일시적으로 기억해두는 고속의 저장영역이다. CPU는 자체 저장 기능이 없는데, 이를 보완하는 역할을 한다. 32비트는 E(AX) 64비트는 R(AX)와 같이 표현된다. Intel과 AT&T문법이 존재하며, 둘은 호환되지 않는다. Intel : 뒤에서 앞으로, 숫자를 그대로 사용, 명칭 그대로를 사용 AT&T : 앞에서 뒤로, 숫자 앞에 $를 붙여서 사용, 명칭 앞에 %를 붙임 !! 단순히 계산한 값은 동일하지만 저장되는 레지스터가 달라져 이후 계산 시 결과가 달라짐 범용 레지스터 EAX 사칙연산 등 산술에 사용되고..

article thumbnail
[AI] Open cv에서 데이터 다루기
카테고리 없음 2023. 9. 11. 09:45

데이터 타입 확인 데이터 shape, size, dtype을 확인할 수 있다. 사용법 import cv2 img = cv2.imread('data/messi5.jpg') print(img.shape) print(img.size) print(img.dtype) 이미지 나누고 합치기 이미지 나누기 : 이미지 합치기 : import cv2 img = cv2.imread('data/messi5.jpg') b,g,r = cv2.split(img) cv2.imshow('b', b) cv2.imshow('g', g) cv2.imshow('r', r) img = cv2.merge((b,g,r)) cv2.imshow('image',img) cv2.waitKey() cv2.destroyAllWindows() 이미지 리사이..

[AI] Open cv로 영상 다루기
AI 2023. 9. 4. 08:14

opencv 영상 파일 읽는 법 우선 OpenCV 라이브러리를 설치해야합니다. 다음 명령어를 입력하여 설치할 수 있습니다. pip install opencv-python OpenCV를 가져옵니다. import cv2 영상 파일을 읽을 땐 'cv2.imread()' 함수를 사용해야합니다. 이 함수는 이미지 파일의 경로를 입력으로 받고 이미지를 반환합니다. import = cv2.imread('영상파일경로.jpg') 읽은 이미지를 화면에 표시하거나 다른 작업을 수행 할 수 있습니다 OpenCV로 다양한 영상 처리 작업하기 예시 코드 cv2.imshow('이미지 창 제목', image) cv2.waitKey(0) cv2.destoryAllWindows() cv2.imshow() 함수 : 이미지를 화면에 표시하..

article thumbnail
[알고리즘] 개념 정리하기
CS 2023. 9. 2. 17:20

다이나믹 프로그래밍 연산 속도와 메모리 공간을 최대한으로 활용할 수 있는 효율적인 알고리즘을 작성하는데 해결할 수 있는 대표적인 방법. 큰 문제를 작은 문제로 나누어 푸는 문제를 일컫는 말 / 한 번 계산한 문제는 다시 계산하지 않도록 하는 알고리즘 DP는 다음의 조건을 만족할 때 사용할 수 있음 최적 부분 구조 (Optimal Substructure) 큰 문제를 작은 문제로 나눌 수 있고, 작은 문제의 답을 모아 큰 문제를 해결할 수 있는 경우를 의미 중복되는 부분 문제 (Overlapping Subproblem) 동일한 작은 문제를 반복적으로 해결해야 하는 경우 피보나치 수열 피보나치 수열이란 이전 두 항의 합을 현재의 항으로 설정하는 특징을 가진 수열이다. 점화식 풀이 _ 단순 재귀 함수 def f..

[JS] 엄격 모드(Strict Mode)
JavaScript 2023. 8. 30. 05:59

Strict mode란? 우리는 개발할때 오타나 문법적 실수를 하곤한다. 이 오류를 줄이고 안정적인 코드를 생산하기 위해서는 조금 더 근본적인 접근이 필요하다. 즉, 잠재적 오류를 발생시키기 어려운 개발환경을 만들고 그 환경에서 개발하는것이 조금 더 근본적인 해결책이 아닐까. 예를 들어 아래와 같은 코드가 있다고 하자. 결과값은 어떻게 될까? function foo() { x = 10; } foo(); console.log(x); // ? 함수 내부에서 변수에 값이 할당되었기 때문에 console.log에는 에러가 발생할거라고 예상했을 수도있지만, 할당 된 값 10이 찍혔다. 그 이유는 자바스크립트의 암묵적 전역때문이다. 암묵적 전역 위 코드와 함께 설명하자면, 코드를 동작시켰을때 자바스크립트 엔진은 값..

article thumbnail
[정보 보안] 체육을 잘하면 악성코드를 잘 분석할 수 있다?! (feat. PE)
카테고리 없음 2023. 8. 27. 21:12

아마 제목이 무슨 말인가 싶어서 들어와본 사람들이 많지 않을까 싶습니다. 악성 코드를 분석하기 위해 여러가지 방법을 활용할 수 있는데, 그중 하나가 이 PE라는 녀석입니다. Physical Education? 아니, Portable Excutable이라고 하죠. PE란? 영어 약자를 풀면 PE(Portable Executable) 즉, 말 그대로 옮겨다니면서 실행시킬 수 있는 파일을 뜻합니다. MS에서 다른 운영체제와 이식성을 좋게 하기위해 만든 파일 포맷입니다. 종류 실행, 드라이버, 라이브러리, 오브젝트 총 4개의 계열이 있습니다 실행계열: EXE, SCR 드라이버계열: SYS,VXD 라이브러리 계열: DLL, OCX, CPL, DRV 오브젝트 계열: OBJ PE구조는 파일이 실행되기 위한 모든 정보..

article thumbnail
[AI] Anaconda 설치 및 가상환경 세팅하기
AI 2023. 8. 21. 10:03

Anaconda 3란?Anaconda는 머신러닝이나 데이터 분석 등에 사용되는 여러가지 패키지가 기본적으로 포함된 파이썬 배포판입니다. 파이썬 가상환경 구축에 용이하게 사용되고, 내부적으로 conda라는 환경과 패키지 관리자가 존재합니다. 이 conda를 통해 패키지를 설치하거나 가상환경을 관리할 수 있습니다.Anaconda 가상환경이란?가상환경은 "프로젝트를 위한 격리된 환경을 만드는 것"입니다. Python을 포함하여 대부분의 프로그래밍 언어들은 패키지(또는 모듈)의 버전을 계속해서 최신화하고 있습니다. 버전마다 일부 기능들은 없어지거나 새로 생깁니다. 지금 저에게 필요한 특정 기능이 최신 버전에는 없을 수도 있기 때문에 최신 버전이 무조건 좋은 것은 아닐 수도 있다는 말입니다. 하지만 하나의 환경에..