학교 디지털 출결 제작기


# LLM의 카운팅 문제와 근본적 한계

현대의 Large Language Models (LLMs)은 놀라운 자연어 처리 능력을 보여주고 있지만, 기본적인 카운팅 작업에서 의외의 한계를 드러내고 있습니다. 이는 단순한 기술적 결함이 아닌, 모델 아키텍처의 근본적인 특성에서 기인하는 문제입니다.

## 트랜스포머의 등장과 혁신

2017년 "Attention is All You Need" 논문의 발표 이후, 트랜스포머 모델은 AI 분야에 혁명적인 변화를 가져왔습니다. 이 모델은 ChatGPT, Claude, Gemini, LLaMA 등 현대 AI의 기반이 되었으며, 텍스트 처리뿐만 아니라 오디오, 비디오, 번역 등 다양한 분야로 확장되었습니다.

## 현재 LLM의 주요 한계점

LLM은 텍스트 길이 제어에서 어려움을 겪고 있습니다. 예를 들어, 200단어를 요청했을 때 150단어나 250단어를 생성하는 등 정확한 길이 조절에 실패하는 경우가 많습니다. 또한 컨텍스트 길이의 제한으로 인해 긴 문서 처리에 제약이 있습니다. 문자열 패턴 카운팅에서도 문제가 발생하는데, 단순히 "strawberry"에서 'r'의 개수를 세는 작업에서조차 오류가 발생하며, 한글의 중복 종성과 같은 반복 패턴 인식에서도 취약성을 보입니다.

<Math math="Accuracy_{counting} = \frac{\text{Correct Count}}{\text{Total Attempts}} \times 100" />

## 트랜스포머 아키텍처의 구조적 특성

트랜스포머의 핵심인 어텐션 메커니즘은 문장의 모든 단어 간 관계를 동시에 고려할 수 있는 강력한 기능을 제공합니다. 이는 다음과 같은 수학적 구조로 표현됩니다:

<Math math="Attention(Q, K, V) = softmax(\frac{QK^T}{\sqrt{d_k}})V" block />

하지만 이러한 구조는 시퀀스 길이에 따라 제곱에 비례하는 높은 연산 복잡도를 야기합니다:

<Math math="Complexity = O(n^2 \cdot d)" block />

여기서 n은 시퀀스 길이, d는 차원을 나타냅니다.

# 셀프 어텐션과 메모리 문제

트랜스포머 모델은 여러 관점에서 단어 간 관계를 해석하는 멀티헤드 어텐션을 사용합니다. 이 구조는 뛰어난 성능을 보여주지만, 동시에 상당한 계산 자원을 필요로 합니다. 멀티헤드 어텐션의 수학적 구조는 다음과 같이 표현됩니다:

<Math math="MultiHead(Q, K, V) = Concat(head_1, ..., head_h)W^O" block />
<Math math="where\ head_i = Attention(QW^Q_i, KW^K_i, VW^V_i)" block />

각 헤드가 독립적으로 연산을 수행하면서 상당한 메모리를 필요로 하게 됩니다:

<Math math="Memory_{required} = h \times (3 \times d^2) +" block />
<Math math="BatchSize \times SeqLength \times ModelDim \times 4" block />

## Chain-of-Thought 프롬프팅 해결방안

Chain-of-Thought(CoT) 프롬프팅은 LLM의 추론 능력을 향상시키는 효과적인 방법입니다. 이는 다음과 같은 수학적 표현으로 나타낼 수 있습니다:

<Math math="P(answer|steps, problem) =" block />
<Math math="\frac{P(steps|problem) \times P(answer|steps)}{P(problem)}" block />

### CoT의 실제 적용 예시

일반적인 프롬프팅과 CoT 프롬프팅의 차이는 다음과 같습니다:

일반적 프롬프팅:

```
Q: strawberry에서 'r'의 개수는?
A: 2개
```

CoT 프롬프팅:

```
Q: strawberry에서 'r'의 개수를 단계별로 세어주세요.
A: 1단계: 각 글자 확인
   s(r없음) → t(r없음) → r(첫번째) → a(r없음) → w(r없음)
   → b(r없음) → e(r없음) → r(두번째) → r(세번째) → y(r없음)
   총 개수: 3개
```

## 하드웨어 요구사항과 제약

현대의 트랜스포머 모델은 상당한 컴퓨팅 파워를 필요로 합니다. 이는 다음 수식으로 표현됩니다:

<Math math="Computing_{power} =" block />
<Math math="\frac{Parameters \times Tokens}{Time}" block />

이러한 요구사항으로 인해 NVIDIA AI 칩과 같은 고성능 하드웨어가 필수적이며, 이는 높은 전력 소비와 메모리 사용량 증가로 이어집니다. 결과적으로 입력 토큰 수에 제한을 둘 수밖에 없는 상황입니다.

# 차세대 아키텍처와 미래 전망

## MOE (Mixture of Experts) 아키텍처

MOE는 트랜스포머의 한계를 극복하기 위한 혁신적인 접근 방식으로, 여러 전문가 모델들을 효과적으로 결합합니다. 이 아키텍처는 계산 효율성을 크게 향상시키는데, 필요한 경우에만 특정 전문가 모델을 활성화함으로써 전체 시스템의 계산 부하를 줄일 수 있습니다. 또한 메모리 사용을 최적화하여, 한정된 자원으로도 더 큰 모델을 운영할 수 있게 합니다. 각 전문가 모델이 특정 태스크에 특화되어 있어, 복잡한 문제를 더 효과적으로 해결할 수 있습니다.

MOE의 수학적 구조는 다음과 같이 표현됩니다:

<Math math="Output = \sum_{i=1}^n g_i(x)f_i(x)" block />

여기서 g_i(x)는 각 전문가를 선택하는 게이팅 함수이며, f_i(x)는 각 전문가 모델의 출력을 나타냅니다. 이러한 구조를 통해 시스템은 입력에 따라 가장 적합한 전문가를 동적으로 선택하여 처리할 수 있습니다.

## 하이퍼스케일 AI 연구 동향

하이퍼스케일 AI는 대규모 확장성을 목표로 발전하고 있으며, 그 성능은 다음과 같은 스케일링 법칙을 따릅니다:

<Math math="Performance =" block />
<Math math="\alpha \log(N) + \beta \sqrt{C}" block />

이 식에서 N은 파라미터 수, C는 컴퓨팅 능력을 나타내며, α와 β는 스케일링 계수입니다. 이러한 관계는 모델 크기와 컴퓨팅 파워 증가에 따른 성능 향상을 예측하는 데 도움을 줍니다.

## Mamba 아키텍처

Mamba는 선택적 상태 공간 모델링을 통해 트랜스포머의 한계를 극복하려는 새로운 시도입니다. 이 모델의 핵심 메커니즘은 다음과 같이 표현됩니다:

<Math math="h_t = \phi(x_t, h_{t-1})" block />
<Math math="y_t = \psi(h_t)" block />

Mamba는 선형 시간 복잡도를 가지고 있어 긴 시퀀스를 효율적으로 처리할 수 있으며, 메모리 사용량도 크게 개선되었습니다. 특히 긴 문맥을 필요로 하는 태스크에서 뛰어난 성능을 보여줍니다.

## 종합적 전망 및 발전 방향

AI 기술은 효율성, 확장성, 새로운 패러다임이라는 세 가지 주요 축을 중심으로 발전하고 있습니다. 효율성 측면에서는 다음 수식으로 표현되는 성능 대비 자원 사용률의 최적화가 진행되고 있습니다:

<Math math="Efficiency = \frac{Performance}{Resource_{usage}}" block />

확장성 강화를 위해 분산 처리 기술이 발전하고 있으며, 모듈화된 아키텍처와 리소스 최적화 기술이 도입되고 있습니다. 새로운 패러다임으로는 하이브리드 아키텍처, 생물학적 영감을 받은 모델, 양자 컴퓨팅 통합 등이 연구되고 있습니다.

# 결론

트랜스포머는 AI 발전의 중요한 이정표였지만, 그 한계는 분명합니다. MOE, Mamba, 하이퍼스케일 AI와 같은 새로운 접근 방식들은 이러한 한계를 극복하고 AI의 새로운 지평을 열어갈 것으로 기대됩니다.

# Future Research Directions

향후 AI 연구는 계산 효율성 최적화, 메모리 사용량 절감, 확장성 있는 아키텍처 개발, 하이브리드 접근법 연구 등에 집중될 것으로 예상됩니다. 이러한 연구들은 더 효율적이고 강력한 AI 시스템의 개발을 가능하게 할 것입니다.

## 새로운 아키텍처의 등장

### SSM (State Space Model)

SSM은 트랜스포머의 대안으로 주목받고 있는 새로운 아키텍처입니다. 이 모델은 시스템의 상태를 연속적으로 업데이트하면서 입력을 처리하는 방식으로 작동하며, 다음과 같은 수학적 구조를 가집니다:

<Math math="h_{t+1} = Ah_t + Bx_t" block />
<Math math="y_t = Ch_t + Dx_t" block />

SSM은 선형 시간 복잡도를 가지고 있어 긴 시퀀스를 효율적으로 처리할 수 있으며, 메모리 사용량도 트랜스포머에 비해 크게 개선되었습니다. 특히 긴 시퀀스 처리가 필요한 태스크에서 뛰어난 성능을 보여줍니다.

### Mamba 아키텍처의 혁신

Mamba는 SSM을 기반으로 하되, 선택적 상태 업데이트 메커니즘을 도입한 혁신적인 모델입니다. 그 수학적 구조는 다음과 같습니다:

<Math math="S_{t+1} =" block />
<Math math="\Delta_t \odot (A_t S_t + B_t x_t)" block />

이 모델은 선택적 상태 업데이트를 통해 계산 효율성을 높이고, 하드웨어 최적화를 통해 성능을 개선했으며, 특히 긴 컨텍스트를 처리하는 데 탁월한 능력을 보여줍니다.

### Jamba: 하이브리드 접근의 미래

Jamba는 트랜스포머와 Mamba의 장점을 결합한 하이브리드 모델입니다. 이 모델은 다음과 같은 수식으로 표현되는 혼합 구조를 가집니다:

<Math math="Output = \alpha T(x) + (1-\alpha)M(x)" block />

이 모델은 120B의 활성 파라미터를 가지고 있으며, 향상된 처리량과 긴 시퀀스 처리 능력을 제공합니다. 트랜스포머의 강력한 병렬 처리 능력과 Mamba의 효율적인 시퀀스 처리 능력을 모두 활용할 수 있다는 것이 큰 장점입니다.

## 미래 전망

### 실시간 처리 최적화

마이크로소프트의 디코더 기반 트랜스포머는 실시간 처리에 최적화되어 있으며, 다음과 같은 지연 시간 공식을 따릅니다:

<Math math="Latency = \frac{TokenCount}{ProcessingSpeed}" block />

이를 통해 실시간 응용 프로그램에서도 효과적인 성능을 발휘할 수 있습니다.

### 멀티모달 통합의 진화

AI 시스템은 점차 다양한 형태의 입력을 통합적으로 처리하는 방향으로 발전하고 있습니다. 이는 다음과 같은 포괄적인 이해 모델로 표현됩니다:

<Math math="Understanding =" block />
<Math math="f(Text, Vision, Audio, Interaction)" block />

이러한 통합적 접근은 AI 시스템이 인간의 인지 과정을 더 잘 모방할 수 있게 해줍니다.

### 계산 효율성의 혁신

새로운 아키텍처들은 각각 다른 계산 복잡도를 가지고 있습니다:

- 트랜스포머는 O(n²)의 복잡도로 인해 긴 시퀀스 처리에 제약이 있습니다.
- SSM과 Mamba는 O(n)의 선형 복잡도로 더 효율적인 처리가 가능합니다.
- Jamba는 O(n·log(n))의 복잡도로 효율성과 성능의 균형을 추구합니다.

# 마무리: AI 아키텍처의 미래

현재 AI 기술은 트랜스포머의 한계를 극복하고 더 효율적인 아키텍처를 향해 나아가고 있습니다. Mamba, SSM, Jamba와 같은 혁신적인 모델들은 기존 트랜스포머의 제약을 해결하면서도, 더 나은 성능을 제공할 것으로 기대됩니다.

이러한 새로운 아키텍처들은 단순한 성능 향상을 넘어 계산 효율성과 리소스 활용의 최적화를 함께 고려하고 있습니다. 이는 AI 기술의 지속 가능한 발전을 위해 매우 중요한 방향성입니다.

앞으로의 AI 발전은 실시간 처리, 멀티모달 통합, 계산 효율성 향상 등의 영역에서 획기적인 발전이 이루어질 것으로 예상됩니다. 이러한 발전은 AI가 우리의 일상생활에 더욱 자연스럽게 통합되는 데 기여할 것입니다.

## 참고 문헌

1. Vaswani, A., et al. (2017). "Attention Is All You Need". arXiv preprint arXiv:1706.03762.
2. 안될공학. (2023). "트랜스포머를 넘어 MoE와 SSM까지, 미래 AI의 방향은?...". [YouTube](https://youtu.be/NSt259rpsKM?si=mugw0frQqWOJIUcT)
3. Gu, A., et al. (2023). "Mamba: Linear-Time Sequence Modeling with Selective State Spaces". arXiv preprint arXiv:2312.00752.
4. Wei, J., et al. (2022). "Chain of Thought Prompting Elicits Reasoning in Large Language Models". arXiv preprint arXiv:2201.11903.
5. Brown, T., et al. (2020). "Language Models are Few-Shot Learners". arXiv preprint arXiv:2005.14165.


LLM의 진화, 그리고 한계


# 학교 디지털 출결 제작기

안녕하세요, Sungblab입니다! 제 고등학교 학생들을 위한 QR코드 디지털 출결 시스템 개발 이야기를 공유하려고 합니다.
기존 수기 출결의 문제점을 인식하고 이를 개선하고자 프로젝트를 시작하게 되었습니다.

### 1. 기획

풀스택 개발을 기획하면서, 출결 체크 방식으로 지문인식, RFID 카드, QR코드 등 다양한 방법을 검토했습니다.
그 중에서 비용 효율성과 접근성이 뛰어난 QR코드 방식을 선택했습니다. 네이버 QR코드 로그인 시스템에서 영감을 받아,
각 사용자의 고유 QR코드를 스캐너가 인식하는 방식을 구상했습니다.

#### 기술 스택 선정

- **Frontend**: Vanilla HTML
- **Backend**: Express.js & Node.js
- **Database**: MongoDB
- **인증/보안**: JWT & bcrypt
- **UI/스타일링**: Tailwind CSS

개발은 Claude 3.5 Sonnet의 도움을 받아 진행했습니다. 먼저 백엔드 코드를 완성한 후, 이에 맞춰 프론트엔드 코드를 작성하는 방식으로 접근했습니다.
약 1,000여 줄의 코드를 작성했으며, 프론트엔드는 React도 고려했으나 초기 학습 곡선이 높아 Vanilla HTML을 선택했습니다.

### 2. 개발 과정

![image.png](/images/pr6.png)

```
📁 프로젝트 루트
├── 📁 css
├── 📁 js
├── 📁 node_modules
├── 📄 change-password.html
├── 📄 dashboard.html
├── 📄 find-password.html
├── 📄 hub.html
├── 📄 index.html
├── 📄 package.json
├── 📄 package-lock.json
├── 📄 qr.html
├── 📄 reader.html
├── 📄 signup.html
├── 📄 statistics-dashboard.html
└── 📄 tailwind.config.js
```

프로젝트 구조는 다음과 같습니다:

- `index.html`: 로그인 페이지
- `hub.html`: 사용자 권한에 따른 분기 처리
  - 일반 사용자: `qr.html`로 자동 리다이렉트
  - admin/reader 권한: hub 페이지에서 메뉴 선택 가능
- `qr.html`: 30초마다 자동 갱신되는 암호화된 QR코드 표시
- `reader.html`: QR코드 스캔 페이지

![image.png](/images/관리자페이지.png)
관리자 대시보드에서는 사용자 승인과 권한 관리 등 다양한 관리 기능을 제공합니다.

![image.png](/images/11.png)
통계 대시보드는 가장 공을 들인 페이지로, 전체 출결 현황과 개별 학생의 상세 통계를 확인할 수 있습니다.

![image.png](/images/22.png)
병결 등 특별한 사유가 있는 경우를 위해 인정출결 처리 기능을 구현했습니다.

![image.png](/images/33.png)
나이스 학사일정 API를 연동하여 주말 및 공휴일을 자동으로 등록하는 기능을 제공합니다.

![image.png](/images/44.png)
출석, 지각, 결석의 기준 시각을 설정할 수 있으며, 미출석 시 자동 결석 처리되는 기능을 구현했습니다.

추가로, React Native를 활용하여 하이브리드 앱도 개발했습니다.

![image.png](/images/앱.png)

### 3. 마무리

2024년 9월부터 12월까지 제 학급에서 시범 운영을 성공적으로 완료했으며, 2025년 새 학기부터는 전교 확대 운영을 계획하고 있습니다.
현재 만 17세라는 나이 제한으로 인해 앱 출시에는 어려움이 있지만, 이는 추후 해결해 나갈 예정입니다.

<div
  style={{
    position: "relative",
    paddingBottom: "56.25%",
    height: 0,
    overflow: "hidden",
    maxWidth: "100%",
    marginTop: "2rem",
  }}
>
  <iframe
    style={{
      position: "absolute",
      top: 0,
      left: 0,
      width: "100%",
      height: "100%",
    }}
    src="https://www.youtube.com/embed/uVYktO-Xy3U"
    title="디지털 출결 시스템 소개"
    frameBorder="0"
    allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
    allowFullScreen
  ></iframe>
</div>



# 학교 커뮤니티 웹사이트를 만들게 된 계기

안녕하세요, Sungblab입니다! 완도고등학교 학생들을 위한 커뮤니티 사이트 '완대전' 개발 이야기를 공유하려고 합니다. 기존의 여러 커뮤니티 사이트들이 있었지만, 우리 학교만의 특화된 기능들이 필요하다고 생각했습니다.

#### 기술 스택 선택

프로젝트를 시작하면서 가장 중요하게 생각한 것은 구조가 쉽고 빠르게 개발하는 것이었습니다. 이를 위해 다음과 같은 기술 스택을 선택했습니다:

- **Frontend**: Vanilla HTML
- **Backend**: Express.js & Node.js
- **Database**: MongoDB
- **인증/보안**: JWT & bcrypt
- **UI/스타일링**: Tailwind CSS

## 제작 과정

### 1. 기획

친구와 이야기를 나누던 중, 다른 학교에서 '과구리'라는 자체 커뮤니티와 다양한 시스템을 운영하고 있다는 것을 알게 되었습니다. 이를 계기로 저도 우리 학교만의 커뮤니티 사이트를 만들어보고 싶다는 생각을 하게 되었습니다.

![image.png](/images/과구리.png)

위 사이트가 제가 벤치마킹한 사이트입니다. 이를 참고하여 제가 만들고 싶은 커뮤니티 사이트의 모습을 구상하게 되었습니다.

여름방학에 개발에 착수했는데, 마침 그때가 Claude 3.5 Sonnet이 처음 출시되었을 때였습니다. 이를 적극 활용하여 개발을 진행했고, 초기 개발 완료 후 테스트를 거쳐 프론트엔드는 Netlify에, 백엔드는 Cloudtype에 호스팅을 진행했습니다. 커뮤니티 기능을 제외한 모든 부분이 성공적으로 구현되었고, 이후 제 이름을 걸고 학교에 포스터를 게시하여 홍보도 진행했습니다(비록 아직 활발한 사용은 이루어지지 않고 있지만요).

### 2. 개발

![image.png](/images/완대전.png)

위 이미지는 메인 페이지입니다. 벤치마킹한 사이트와 레이아웃이 비슷한 것을 확인할 수 있습니다. Claude의 도움으로 초안 제작 및 테스트를 일주일 만에 완료했습니다. 제 첫 풀스택 프로젝트였는데, 나름 만족스러운 결과물이 나왔습니다. 우리 학교의 상징색인 푸른색을 테마로 적용했으며, 급식 정보는 나이스 OPEN API를 활용하여 백엔드에서 구현했습니다.

![image.png](/images/공지사항.png)
관리자 계정으로 로그인했을 때 볼 수 있는 공지사항 작성 페이지입니다. 목록에서 작성 및 수정이 가능합니다.

![image.png](/images/청원.png)
청원 페이지에서는 로그인한 사용자만 청원을 요청하고 투표에 참여할 수 있습니다.

![image.png](/images/도우미.png)
학급 도우미 페이지에는 대포 뽑기, 타이머, 무작위 팀 뽑기 등 여러 가지 유용한 기능들을 모아놓았습니다.

![image.png](/images/소개.png)
소개 페이지에는 사이트 소개와 함께 맨 아래에 개발자 연혁을 포함했습니다.

![image.png](/images/커뮤.png)
커뮤니티 페이지는 가장 고민을 많이 한 부분입니다. 익명 게시판으로 만들고 싶었지만, 여러 문제점들을 고려해야 했습니다. 로그인 사용자의 익명성 보장 문제, 비로그인 사용자의 악용 가능성 등을 고민한 끝에 DC인사이드와 같은 IP 기반 익명 시스템을 도입하기로 결정했습니다.

![image.png](/images/글쓰기.png)
이미지 업로드 기능을 포함한 글쓰기 기능을 구현했으며, 로그인 사용자는 실명으로, 비로그인 사용자는 익명으로 글을 작성할 수 있도록 설정했습니다.

![image.png](/images/글.png)
게시글 페이지도 DC인사이드를 참고하여 추천 시스템과 댓글 기능을 구현했으며, 주간 베스트 시스템도 추가했습니다.

### 3. 마무리

이 프로젝트는 학교 동아리 활동의 일환으로 제작되었습니다. 아직 활성화되지는 않았지만, 성공적으로 개발을 완료하고 운영 중이라 만족스럽습니다. 현재 서비스를 운영 중이므로, 코드가 궁금하신 분들은 개별적으로 연락 주시면 감사하겠습니다.


학교 디지털 출결 제작기

학교 디지털 출결 제작기

1. 기획

기술 스택 선정

2. 개발 과정

3. 마무리

학교 커뮤니티 웹사이트 제작기

LLM의 진화, 그리고 한계

Contents

Related Posts

학교 커뮤니티 웹사이트 제작기

클로드 api를 활용한 진로상담 챗봇 만들기

파이썬 face recognition 라이브러리를 활용한 얼굴인식 출결 시스템 제작