이 페이지의 이전 버전을 보고 있습니다. 현재 버전 보기.

현재와 비교 페이지 이력 보기

« 이전 버전 4 다음 »

Build Everything Project 1


관련 자료

GitHub Repository: https://github.com/studydev/buildflow

Dev Site: https://nexus.studydev.com/

NexusSkill Platform Preview


1. 이 프로젝트를 왜 만들었나

Microsoft Azure 기반의 기술 워크샵과 학습 콘텐츠는 해마다 꾸준히 만들어지고 있지만, 실제 현장에서는 다음과 같은 문제가 반복되어 왔다.

  • 좋은 워크샵 자료와 GitHub 레포지토리가 개인 또는 팀 단위로 흩어져 있음

  • 누가 어떤 콘텐츠를 만들었고, 실제로 고객에게 전달해 본 경험이 있는지 알기 어려움

  • 과거에 사용했던 워크샵 자료가 재사용되지 않고 다시 만들어지는 경우가 많음

  • 고객 입장에서는 “어디서부터 무엇을 보면 되는지”를 스스로 판단하기 어려움

NexusSkill 프로젝트는 이런 문제를 해결하기 위해 시작되었다.
핵심 목표는 단순한 자료 저장소가 아니라,

Azure 기반 워크샵과 학습 콘텐츠를 하나의 흐름으로 연결하고,
누구나 쉽게 찾고, 이해하고, 실제로 실행할 수 있도록 만드는 플랫폼

을 만드는 것이다.


2. NexusSkill이 해결하고자 하는 문제

2.1 내부 관점 (Microsoft 엔지니어 / 파트너)

  • GitHub 레포지토리, PPT/PDF, 영상, 워크샵 가이드를 한 곳에서 관리

  • “이 콘텐츠를 누가 만들었는지 / 누가 실제로 실행해봤는지”가 명확히 보임

  • 신규 엔지니어도 기존 자산을 빠르게 이해하고 활용 가능

  • 워크샵 경험이 개인의 경험이 아니라 조직의 자산으로 축적됨

2.2 외부 관점 (고객 / 학습자)

  • Azure 워크샵 콘텐츠를 검색 기반으로 탐색

  • GitHub → 설명 → 데모 → 실습까지 이어지는 학습 흐름 제공

  • 단순 문서가 아닌, 실제로 검증된 실습 중심 콘텐츠를 소비 가능


3. NexusSkill의 핵심 컨셉

NexusSkill은 다음과 같은 원칙을 중심으로 설계되었다.

3.1 GitHub 중심 (GitHub-first)

  • 모든 콘텐츠의 출발점은 GitHub Repository

  • README, 코드 구조, 릴리즈, 커밋 활동 등에서 메타데이터를 수집

  • 단순 링크 수집이 아니라, 레포지토리를 “학습 콘텐츠”로 재해석

3.2 파이프라인 기반 (Pipeline-first)

  • 모든 분석과 가공 작업은 비동기 파이프라인으로 처리

  • 사용자 요청 → 파이프라인 실행 → 결과 축적 → 검색 인덱싱

  • API는 제어(Control Plane)만 담당하고, 무거운 작업은 분리

3.3 AI 보조 (AI-enriched)

  • GitHub 콘텐츠를 기반으로:

    • 요약

    • 카테고리 분류

    • 사용 기술 식별

    • 난이도 추정

  • 장기적으로는 한글화, 썸네일 생성, 추천까지 확장


4. 전체 아키텍처 구성

4.1 Azure 기반 구성 개요

NexusSkill은 Azure-native 아키텍처를 기반으로 한다.

컨셉에 대한 세밀화와 기획은 김현수 로부터 시작하며, 관심있는 분들을 모아 의견을 청취하여 Copilot을 통해 개발을 한다.

  • Frontend

    • Azure Static Web Apps

    • 로그인 없이도 콘텐츠 탐색 가능

  • Backend API

    • Azure Container Apps

    • 인증, 파이프라인 제어, 검색 API 제공

    • GitHub 분석, AI 처리, 인덱싱을 비동기로 실행

  • Data Store

    • Cosmos DB (NoSQL)

    • 원본 데이터와 가공된 메타데이터 분리 저장

  • Search

    • Azure AI Search

    • 키워드 + 벡터 기반 하이브리드 검색

  • Email

    • Azure Communication Services (Email)

    • OTP 기반 로그인 인증

  • CICD: Github Actions Workflow
    • Frontend
    • Backend

인프라 구조


5. 인증과 접근 방식

5.1 회원가입 없는 이메일 OTP 인증

NexusSkill은 전통적인 회원가입을 요구하지 않는다.

  • 이메일 입력 → OTP 인증 → 로그인

  • 비밀번호 저장 없음

  • 개인정보 최소화 원칙 준수

5.2 역할 기반 접근

  • 일반 사용자

    • 로그인 없이 콘텐츠 탐색 가능

  • 로그인 사용자 - 기여자(Contributor)

    • 내부 전용 콘텐츠 열람

    • 콘텐츠 등록

    • GitHub 분석 파이프라인 실행

    • 워크샵 경험 라벨링


6. 콘텐츠 흐름 예시

  1. GitHub 레포지토리 URL 등록

    • 분석 파이프라인 실행

    • README / 메타데이터 수집

    • 기술 스택 식별

    • AI 기반 요약 및 분류

    • 썸네일 이미지 생성

    • 검색 인덱스 반영

  2. 사용자에게 카드 형태로 노출

    • GitHub 링크

    • 데모 / 문서 / 영상 (있는 경우)

    • 난이도 / 예상 소요 시간


7. 이 프로젝트의 의미

NexusSkill은 단순한 웹 애플리케이션이 아니다.

  • 워크샵 경험을 구조화하는 시도

  • 개인의 지식을 조직의 학습 자산으로 전환

  • Azure 기술을 실제로 “학습과 전달”에 적용한 사례

장기적으로는,

  • 추천 기반 학습

  • AI Assistant를 통한 워크샵 가이드

  • 지속적인 콘텐츠 갱신과 확장

으로 발전할 수 있는 기반을 목표로 한다.


8. 마무리

NexusSkill은 “좋은 Azure 워크샵 콘텐츠는 이미 많다”는 전제에서 출발한다. 많은 콘텐츠를 공유하자.

이 프로젝트의 가치는 새로운 콘텐츠를 만드는 것이 아니라, 이미 존재하는 자산을 연결하고, 이해하고, 다시 쓰게 만드는 것에 있다.


9. 10일간 만들어본 후기

  1. 기획이 제일 중요

    1.  처음에 아이디어를 체계적으로 잡는게 중요하다.
    2. 유저의 흐름
    3. 기여자의 흐름

  2. 개발툴

    1. VS Code + GitHub Copilot 은 쓸만하다.
    2. task는 정의해 두면, backend랑 frontend랑 서버 실행시킬 때 편하다.
      .vscode/tasks.json
      {
  "version": "2.0.0",
  "tasks": [
    {
      "label": "dev:backend",
      "type": "shell",
      "command": "cd backend && npm run dev",
      "isBackground": true,
      "presentation": {
        "panel": "dedicated",
        "group": "servers"
      },
      "runOptions": { "reevaluateOnRerun": true }
    },
    {
      "label": "dev:frontend",
      "type": "shell",
      "command": "cd frontend && npm run dev",
      "isBackground": true,
      "presentation": {
        "panel": "dedicated",
        "group": "servers"
      },
      "runOptions": { "reevaluateOnRerun": true }
    },
    {
      "label": "test",
      "type": "shell",
      "command": "npm test",
      "presentation": {
        "panel": "dedicated",
        "group": "tests"
      }
    }
  ]
}

  3.  개발 여정

    1. 아이디어를 정리하며 기획 (1월 16일)

      1. 구체적이지 않을 경우, 뒤에서 다 뜯어고쳐야 하는 문제가 생길 수 있음.
      2. Speckit 으로 구현, 큰 건들은 Speckit, 중간 건들은 Plan 모드, 막 만들때는 Agent 모드에서 그냥 만들고 문서 싱크함.

    2. Frontend 부터 구현: kombai 사용 (1월 17일~19일)

      1. 좋긴 한데, 크레딧 소진이 너무 빠름. 무료 크레딧 기반
      2. 큰 그림만 잡아서 활용한 후에 GitHub Copilot으로 나머지 부분 개발

    3. Backend 구현 (1월 20일~26일)

      1. 로그인 구현, 이메일 OTP로 별도 개인정보 수집 안함. 사내 직원만 이메일 인증 코드 발송, studydev.com으로 도메인 인증
      2. nexusskill 이름 정함. 도메인은 nexus.studydev.com으로 연결
      3. GitHub Actions 구성(처음 CICD 다 한번에 태웠다가 프론트엔드, 백엔드 CI / CD 각각 분리)
      4. 목업 형태로 쓸 컨텐츠 수집하기 (ignite25-next 50 여개 컨텐츠를 Python + LLM으로 수집하여 JSON 저장)
      5. 목업 데이터 기반으로 카드 형태로 컨텐츠 구성하기
      6. 실제 데이터를 담을 수 있는 그릇 준비(cosmosdb) 사용 - 선택 이유. 건바이건으로 담아두고 활용하기에 가장 비용 효율적임.
      7. github repo 컨텐츠 수집 로직 작성 - GitHub URL 넣으면 데이터 크롤링 readme.md와 github api를 활용하여 각종 데이터를 수집
      8. 뭔가 허전해서 컨텐츠 썸네일 이미지 작성(gpt-image-1.5) 3:2 비율, 서비스 나열보다는 어떤 문제를 해결하기에 좋은지 해결점까지의 모습을 그려냄, 분류에 따라 색을 다르게 적용
      9. 검색 엔진(ai search) 도입하고 cosmosdb의 데이터 CRUD를 싱크함, 이때, 검색에 용이하도록 카테고리 분류 및 임베딩 적용 (이때부터, CosmosDB는 검색에 사용 하지 않음, 색인화된 정보로 검색함)
      10. 챗봇 서비스 도입하여 추천할 수 있도록 만듬. 인증 사용자(내부)만 쓸 수 있도록 제한을 걸어둠
      11. 원래 백엔드 container app 하나가 0 베이스로 시작하는건데, 콜드 부팅 때문에 1개로 올려둠. (0.5 코어 기반)
      12. 불필요해 보이는 코드와 인프라 제거

    4. 추가 구현할 예정

      1. 정적 워크샵 페이지 번역하여 등록
      2. 영문 워크샵을 한글 버전으로 이전 및 운영 환경 맞추기 (devcontainer 고려)
      3. nexus 워크샵 환경과 연동하기

  4. 주의 사항

    1. 다른 서비스 포함 $150/월 넘기면 안됨. 개인 계정임. 나중에 인프라 넘길 수 있으면 넘길 예정. 감시중.
  • 레이블 없음