전체 글 40

[Flutter] Flutter Android NDK install 에러

Flutter 프로젝트를 안드로이드 휴대폰으로 직접 빌드를 해보기 위해 flutter run을 실행해보았으나, 갑자기 이런 에러가 나타나며 빌드가 종료되었습니다.FAILURE: Build failed with an exception.* Where:Build file 'C:\Users\user\kwak-21\Flutter\SilentCameraApp\android\build.gradle.kts' line: 16 * What went wrong:A problem occurred configuring project ':app'.> cohttp://m.android.builder.sdk.InstallFailedException: Failed to install the following SDK components..

프론트엔드 2025.04.11

[DB] 관계형 데이터베이스 vs 비관계형 데이터베이스

사용자의 정보, 사용자가 업로드 하는 데이터, 스트리밍 비디오 등, 서비스를 제공하기 위해서는 서비스를 운영하면서 발생하는 데이터를 저장하기 위한 공간이 필요합니다. 이를 곧 데이터베이스(Database, DB)라고 부릅니다. 이번 포스팅에서는 데이터베이스의 분류와 이를 운영하는 방식에 대해 알아보도록 하겠습니다.데이터베이스 분류데이터는 크게 형식, 크기 등이 구조적으로 미리 결정되어 있는 정형 데이터와, 그렇지 않은 비정형 데이터로 나눌 수 있습니다. 이때, 미리 정해져있는 데이터의 구조를 스키마라고 부릅니다. 정형 데이터와 비정형 데이터는 데이터 자체의 형식에서 큰 차이를 보이므로, 이를 저장하는 데이터베이스에서도 차이가 발생합니다. 따라서 주로 정형 데이터는 관계형 데이터베이스에, 비정형 데이터는 ..

AWS 2025.04.08

[AWS] DAS, NAS, SAN과 클라우드 스토리지 서비스

클라우드 스토리지는 사용자들이 퍼블릭 인터넷이나 전용 프라이빗 네트우크를 통해 공유되는 데이터에 접근할 수 있도록 하는 클라우드 컴퓨팅 서비스로, 단순한 저장 공간을 넘어, 비용 효율성, 민첩한 운영, 빠른 서비스 배포, 효율적인 데이터 관리, 그리고 확장성 측면에서 많은 장점을 제공합니다.이번 글에서는 스토리지의 기본 개념부터, 클라우드 환경에서 자주 사용되는 블록 스토리지, 파일 스토리지, 오브젝트 스토리지까지 함께 정리해 보겠습니다.스토리지 구성 방식DAS (Direct-Attached Storage)가장 전통적인 방식의 스토리지입니다.서버에 직접 연결되는 외장형 저장 장치로, 별도의 네트워크를 거치지 않기 때문에 설치가 간편하고 성능도 우수합니다. 하지만 확장성과 공유 측면에서는 한계가 있습니다...

AWS 2025.03.25

[React] react-syntax-highlighter로 코드에 언어별 테마 적용하기

BOJ에서 제출 목록을 불러온 뒤, 제출 코드를 웹에서 미리보기하는 기능을 구현하기 위해 다양한 방법을 찾아보았습니다. 특히 에디터 창에서 보는 것처럼 테마가 적용된 형태로 보여주면 가독성이 훨씬 좋아지므로, 코드 하이라이터를 적용하여 좀 더 깔끔하게 표현해보기로 결정했습니다.이 글에서는 React 환경에서 react-syntax-highlighter를 이용해 코드에 하이라이팅 기능을 구현하는 방법을 소개합니다.react-syntax-highlighter 설치하기하이라이팅 기능을 사용하기 위해서는 먼저 react-syntax-highlighter를 설치해줘야 합니다.작업하고 있는 프로젝트 위치에서 터미널을 열어 아래 명령어를 실행시켜 줍니다.npm install react-syntax-highlighte..

프론트엔드 2025.03.24

[React] Tailwind CSS가 적용되지 않는 문제 해결법

열심히 BOJ-AutoSync 프로젝트를 진행하며 tailwind를 통해 디자인을 적용해보려 했지만, 문제가 발생했습니다.열심히 작성한 React 코드가 전혀 웹 브라우저에서 동작하지 않아 html 문서 그대로 보인다는 점이었습니다😰 이번 포스팅에서는 Tailwind CSS를 설치하고 반영하는 방법에 알아보겠습니다. Tailwind CSS 설치 여부 확인하기프로젝트 루트 위치에서 터미널을 열어 npm list tailwindcss을 입력해 Tailwind CSS가 설치되어 있는지 확인해봅니다.확인해본 결과, 제 경우에는 이미 잘 설치가 되어 있는 상태였습니다. 만약 그렇지 않다면, 아래 명령어들을 순차적으로 실행해 Tailwind CSS를 설치해줍니다.npm install -D tailwindcss p..

프론트엔드 2025.03.19

[Node.js] Windows에서 Node.js 설치하기

Node.js LTS 설치하기 Node.js — 어디서든 JavaScript를 실행하세요Node.js® is a JavaScript runtime built on Chrome's V8 JavaScript engine.nodejs.org위의 링크를 눌러 Node.js 공식사이트에 접속하여 LTS 버전을 다운로드해줍니다.LTS 버전이란?Long-Term Support의 줄임말로, 장기적이고 공식적으로 지원되는 버전을 의미합니다. 최신 버전의 경우 아직 해결되지 않은 버그나 버전 충돌이 발생할 수 있기에 최신 버전을 설치하는 것보다 LTS 버전을 설치하는 것이 바람직할 수 있습니다! 설치된 LTS msi 파일을 실행해 설치를 진행해줍니다. 설치 마법사에서 환경 변수 추가까지 다뤄주기 때문에 특별히 환경 변수를..

프론트엔드 2025.03.18