분류 전체보기 127

[ComputerScience] Memory Model, Stack VS Heap, Memory Operation

이 게시글은서울대학교 데이터사이언스 대학원조요한 교수님의데이터사이언스 응용을 위한 컴퓨팅 강의를학습을 목적으로 재구성하였습니다Memory Model메모리 모델이란프로그래밍 언어에서메모리를 관리하는 방식이다 아마 언어마다 각각의 메모리 모델이다르겠지만, 이번 수업에서는크게 python과 C언어에 대해서만비교를 했다  python의 Memory Modelpython의 메모리 모델은high-levelcomceptual diagram이다 파이썬은  위 다이어그램처럼 메모리를 관리하는데,frame 한 개는한 개의 scope이라고 보면 된다 python은 변수들의 정확한 memory location은숨겨져있으며, reference 형식으로 메모리를 참조한다  C언어의 Memory Model사실 중요한 것은c언어의 ..

[ComputerScience] 프로그래밍 언어 개요(변수, 데이터타입, 범위, 연산자)

이 게시글은서울대학교 데이터사이언스 대학원조요한 교수님의데이터사이언스를 응용을 위한 컴퓨팅강의를 학습 목적으로 재구성하였습니다.Variables(변수)변수란 identifier를 symbolic한어떤 것으로 만드는 것이다 쉽게 말하면,프로그래밍을 하면서 저장한 어떤 데이터를찾기 쉽게 이름을 붙여준 것이다 이게 무슨 말이냐하면예전에 변수가 없었을 때에는개발자가 특정 데이터를 사용하려고 할 때해당 데이터가 담겨있는 메모리 위치를하나하나 기억해서 작성하곤 했는데,찾고자하는 그 데이터의 주소에symbolic한 이름을 붙여줌으로써그 이름만을 가지고 tracking을 가능하게해줬다는 의미이다 이러한 변수의 등장으로코드의 가독성이 높아졌으며개발자가 편하게 프로그래밍을할 수 있게 되었다 이러한 변수에는알맞은 데이터 타..

[ComputerScience] 인터프리터와 컴파일러

이 게시글은서울대학교 데이터사이언스 대학원조요한 교수님의데이터사이언스 응용을 위한 컴퓨팅 강의를학습을 목적으로 재구성하였습니다.첫 번째 강의는 교수님의 이전 강의 내용복습에 관한 내용이었다 간단하게 정리해보고자 한다 인터프리터와 컴파일러Python은 대표적인 인터프리터 언어고C는 대표적인 컴파일러 언어이다그럼 인터프리터와 컴파일러는 무엇이며이 두개는 어떤 차이가 있을까?  인터프리터와 컴파일러는공통적으로 코드를컴퓨터가 알아들을 수 있는 명령어로변환해주는 역할을 한다 옛날부터 배웠을텐데컴퓨터가 알아듣는 건0과 1 뿐이다 우리가 python이나 c언어로 코드를 작성하면python은 인터프리터c언어는 컴파일러를 통해서컴퓨터가 이 파일을 이해하고 실행할 수 있는0과 1의 명령어로 바꾸어준다 이제 코드를 이진수로..

[python] ffmpeg로 wav파일에 header 넣어주기(ffmpeg-python) (feat. microsoft speech cogni

react에서 user가 녹음한 파일을 백엔드로 받아와서 백엔드에서 발음평가 API를 날려 점수를 받아오는 기능을 구현해야했는데,, 내가 이용한 발음평가 API는 Azure AI의 pronunciation assessment였고 cognitive-services-speech-sdk를 다운받아 사용하는 방식이었다 https://ai.azure.com/explore/aiservices/speech/pronunciationassessment?tid=56b5b06f-62d4-4c16-b193-36e8379dae27Azure AI Studioai.azure.com github 코드를 보며 (microsoft라 기대했지만 생각보다 잘 안돼있음^^) https://docs.microsoft.com/azure/cogn..

기술/기타 2024.09.05

[react] client단에서 마이크를 이용해 녹음한 파일 API로 전송하기(multipart 전송)

현재 작업 중인 외주 개발 프로젝트에서user가 영어 문장을 컴퓨터 마이크를 통해 녹음하면해당 녹음 파일을 발음평가 API로 전송해user의 발음 점수를 받아오는 기능을구현해야했다. 따라서 유저가 녹음한 파일을 API를 통해백엔드 서버에 보낸 뒤,백엔드에서 발음평가 API로 다시 전송해서점수를 받아오고 이를 다시 프론트에서 받아와서화면에 뿌려줘야했다 정말 이 기능 구현하면서삽질을 너무너무너무너무너무 많이해서시간낭비를 제대로 했지만 ^^; 이 부분에서 삽질을 한 건 아니라서이 것도 까먹기 전에 얼른 기록으로 남겨두려한다1. recording 상태 확인 할 useState정의우선 record 기능을 컨트롤할버튼을 한 개 구현해줬다 recording이 아닐 때는Button의 텍스트가"Start Recordin..

기술/웹 개발 2024.09.05

[ComputerScience] macOS에서 C/C++ 코딩 환경설정하기

해당 게시글은 서울대학교 데이터사이언스대학원 조요한 교수님의데이터사이언스를 응용을 위한 컴퓨팅 강의를학습 목적으로 재구성하였습니다.이번 수업에서는C++을 이용하여객체지향, 알고리즘들을 배울 예정이라컴퓨터 환경에 C나 C++이 돌아갈 수 있도록하는 것은 필수였다 강의 초반에 교수님께서환경설정 관련 자료를 주셨어서해당 내용을 바탕으로기록해보려한다 나는 MAC을 사용하므로MAC 위주로 정리할 예정1. Visual Studio Code가장 무난한 코드 에디터인visual studio code를사용한다고 한다. 나는 이미 사용 중이었기에만약 로컬에 없다면 아래에서 다운받아준다 https://code.visualstudio.com/download Download Visual Studio Code - Mac, Lin..

[FastAPI/python] 파이썬 FastAPI로 정말 간단하게 API 만들기(CORS)

이번에 외주 작업하고 있는 프로젝트에서사이드 개발을 FastAPI로 하고있는걸 봤다 FastAPI는 들어봤었는데정확히 뭔지도 몰랐고파이썬으로 하는건지도 몰랐는데이번에 작업을 진행하면서정말 이렇게 간단하게도백엔드 작업을 할 수가 있구나 싶었서글을 작성해보려한다 백엔드 입문을spring으로 한 나에게는정말 신세계 그 자체,, https://fastapi.tiangolo.com/ko/#typer-fastapi-cli FastAPIFastAPI framework, high performance, easy to learn, fast to code, ready for productionfastapi.tiangolo.com 공식문서에도 굉장히 설명이 잘돼있어서참고하면 좋을 것 같다FastAPI 설치pip3 insta..

기술/웹 개발 2024.08.31

[PortOne/react] 통합 결제 연동 솔루션 포트원 react 프로젝트에 이식하기

이번애 배정받은 업무는개발하고 있는 웹 사이트의 결제 기능 개발이었다 결제를 위해서는 PortOne API연동을 알아봐달라고 요청받아서이번에 기능을 구현해보면서티스토리에도 남겨보려고 한다PortOne이란?포트원은 여러 가지 결제대행사들을연동해서 결제를 도와주는서비스이다https://portone.io/korea/ko 포트원 | 온라인 비즈니스 성장을 돕는 기업포트원이 제공하는 단 한 줄의 코드로 세상의 모든 결제를 손쉽게 연동해보세요. PG사 통합결제 연동, 해외결제, 파트너 정산 관리, 결제 애널리틱스, 수수료 혜택까지, 포트원의 맞춤 컨설팅을portone.io 설명에 따르면신용카드, 간편결제, 해외결제까지 모두손쉽게 연동이 가능하다고 한다PortOne 회원가입회원가입이 되어있지 않다면당연히 회원가입부..

기술/웹 개발 2024.08.30

[node.js/express/react] 새로운 endpoint로 새로운 화면 띄우기

요즘에 나는 대학원 생활과 동시에한 스타트업의 웹 사이트 개발의외주를 맡고있는데이 작업은node.js/express를 사용한 backend와react를 사용한 frontend 작업이다 아무튼 새로운 pricing 관련 페이지를만들어달라고해서react로 간단한 UI와js 파일을 작업해놓은 상태 이제 node.js에서 react를 사용해서새로운 endpoint에새로운 화면을 띄우는 법을 작성해보도록 하겠당 방법은 초특급 간단하다기존에 이미 기본 페이지가 구현되어있다면App.js에이렇게 구현이 작성이 되어있을 것이다  그럼 새로운 endpoint로 새로운 페이지를 띄우려면root페이지를 불러온 것과 동일하게React의 Route에서} /> 내가 설정해주고싶은 endpoint를 path에화면에 띄워주고싶은 컴포..

기술/웹 개발 2024.08.29