feat: state와 actions를 Store 하나로 통합 (v3.0.0)

v3.0.0

구조 변경 (Refactor)

• Store 통합: state와 actions를 단일 객체로 통합하여 아키텍처 단순화.

마이그레이션 가이드

• v2 사용자들은 기존 state.js의 객체와 actions.js의 함수들을 하나의 Store 객체로 합쳐야 합니다.
• Store 객체 내부에서 데이터를 참조할 때 Store.prop 대신 this.prop을 사용해야 합니다.

feat: ::for 반복 렌더링 및 실시간 데이터 바인딩 구현

🚀 Release Notes: Neo Framework v2.6.0

이번 v2.6.0 업데이트는 Neo 프레임워크가 단순한 정적 렌더러를 넘어, '반응형 데이터 바인딩' 시스템을 갖춘 진정한 프레임워크로 진화한 버전입니다. "최소한의 노력으로 최대의 결과"라는 철학 아래, 복잡한 리스트 처리와 상태 관리를 단숨에 해결했습니다.

🌟 주요 업데이트 (New Features)

• ::for 반복문 구현: Store에 저장된 배열 데이터를 순회하며 동적으로 UI를 생성합니다.
• 지능형 스코프(loopContext): 반복문 내부에서 $todo, index 등 현재 데이터에 즉시 접근할 수 있는 로컬 컨텍스트를 지원합니다.
• 실시간 데이터 동기화: UI에서 발생한 이벤트가 Store의 원본 데이터를 직접 수정하고, 변경 사항을 화면에 즉시 리렌더링합니다.

🛠 버그 수정 및 개선 (Bug Fixes)

• 이벤트 this 바인딩: on:change 등 이벤트 발생 시 this가 해당 HTML 요소를 정확히 가리키지 못하던 문제를 .call() 메서드를 이용해 해결했습니다.
• 로컬 변수 인식 오류: renderTemplate이 전역 window만 탐색하던 문제를 수정하여 loopContext를 최우선으로 탐색하도록 개선했습니다.
• Boolean 속성 처리: checked, disabled 등 불리언 값이 문자열("true")로 박히던 문제를 실제 불리언 값으로 변환하여 적용되도록 수정했습니다.

📝 사용 예제 (Usage)

@ListContainer:div {
  ::for(todo in Store.todoList) {
    @Task:div {
      @Checkbox:input {
        ::attrs { type: "checkbox", checked: "$todo.completed" }
        on:change: todo.completed = this.checked
      }
      @Title:span { innerHTML: "$todo.text" }
    }
  }
}

fix(NeoParser): ensure element order by implementing position-based sorting (v2.5.2)

🐛 Bug Fixes

• ::if 블록 렌더링 순서 오류 수정: 기존 버전에서 ::if 조건문 블록이 일반 태그(@)보다 무조건 부모 요소의 최상단에 먼저 그려지던 문제를 해결했습니다. 이제 작성하신 코드 순서 그대로 화면에 나타납니다.

🛠 Under the Hood (기술적 개선)

• 위치 기반 정렬 (Position-based Sorting) 도입: 파서가 태그나 메타 블록(::if, ::attrs)을 스캔할 때 원본 문자열의 위치 인덱스(_pos)를 '번호표'처럼 부여합니다.
• 인덱스 밀림(Index-shifting) 방지: 파싱이 완료된 블록을 문자열에서 단순히 잘라내는(slice) 대신, 그 길이만큼 공백(" ".repeat())으로 보존하여 뒤따라오는 태그들의 파싱 위치가 꼬이지 않도록 최적화했습니다.
• 결과적으로 가장 적은 코드 변경으로 가장 안정적인 파싱 순서를 보장하게 되었습니다.

💻 Quick Example

이제 아래와 같이 코드를 작성하면, Message 블록이 Input 블록 위로 튀어 오르지 않고 정확히 Input 아래에 렌더링됩니다.

@App:div [p-4] {
  @Input:input [border, p-2] {
    ::attrs: { placeholder: "입력창" }
  }

  ::if($Store.state) {
    @Message:div [text-blue-500, mt-2] {
      innerHTML: "Update! 🚀"
    }
  }
}

feat: add ::if conditional rendering support

🎉 What's New (새로운 기능)

• ::if 조건문 렌더링 지원: 이제 상태값에 따라 컴포넌트를 동적으로 껐다 켤 수 있습니다.

💻 Quick Example (사용 예시)

이제 컴포넌트 내부에서 아래와 같이 직관적으로 조건을 제어할 수 있습니다.

@App:div [p-4] {
  ::if($Store.loggedIn) {
    @WelcomeText:h1 {
      innerHTML: "환영합니다, 유저님!"
    }
  }
}

feat: enable $ binding inside ::attrs with proper render order

추가된 기능

1. ::attrs기능에 $바인딩 추가

@input:input [hello] {
  ::attrs: {
    type: "text",
    placeholder: $Store.count
  }
}

예정된 기능

• 조건 렌더링 ::if

::if ($Store.loggedIn) {
  @Profile:div { ... }
}

feat: fix attrs scope by parsing children before meta blocks

추가된 기능

• attrs블록
  • attrs {....}를 통해 html고유 속성을 지정할 수 있게 되었습니다.

---

예정 기능

• 속성 바인딩

  ::attrs {
    value: $Store.text
  }
  

• 조건 렌더링

   ::if ($Store.loggedIn) {
    @Profile:div { ... }
  }
  

• 반복 렌더링

  ::for (item in Store.list) {
    @Item:li {
      innerHTML: $item.name
    }
  }
  

feat: add nested children parsing and rendering support

추가된 기능

• 자식 파싱
  • 단일 태그만 허용되었지만 자식태그 지원
• 자동 재랜더
  • 바인딩된 변수 값이 바뀔때마다 전채가 자동 재랜더

What's next?

• attrs{....}로 고유 html속성 관리

Neo v2.1.0 – Runtime-first UI DSL

🚀 Neo Framework v2.1.0 Release Notes

Release Date: 2026-01
Version: v2.1.0
Package: @junnyontop-pixel/neo-app

---

✨ Overview

Neo v2.1.0은 runtime-first UI DSL을 목표로 한 안정화 릴리즈입니다.
이 버전부터 Neo는 JavaScript 로직을 직접 다루지 않으며,
UI 선언에만 집중하는 초경량 프레임워크로 재정의되었습니다.

v1의 복잡한 구조와 유지보수 한계를 완전히 제거하고,
단순하고 예측 가능한 렌더링 모델을 채택했습니다.

---

🔥 Major Changes

1️⃣ Runtime-first Architecture

• 빌드 / 컴파일 단계 제거
• .neo 파일을 브라우저에서 직접 로드 → 파싱 → 렌더링
• Vite, Webpack 등 빌드 도구에 비의존적

2️⃣ UI / Logic 완전 분리

• UI: .neo
• 상태 & 로직: 순수 JavaScript (state.js, actions.js)
• Neo는 JavaScript를 해석하거나 변형하지 않음

3️⃣ Global Store Pattern 지원

• window.Store 기반 전역 상태 접근

• 템플릿 바인딩 지원:

  innerHTML: "현재 숫자: $Store.count"
  

• 이벤트에서 Store 메서드 직접 호출 가능:

  on:click: Store.add()
  

4️⃣ 단순하고 명확한 Render Model

• 자동 반응형 ❌
• 명시적 전체 재렌더 ⭕
• 상태 변경 시 __neoRender() 호출 방식

Store.count++;
// 자동으로 main.js에서 호출

---

🧠 Design Philosophy

• Neo는 JavaScript 프레임워크가 아닙니다.
• Neo는 상태를 관리하지 않습니다.
• Neo는 UI 선언만 담당합니다.

JavaScript는 JavaScript답게,
UI는 Neo로 선언하세요.

---

⚠️ Breaking Changes

• #Script 문법 제거
• 컴파일러(neoc) 사용 방식 변경
• Neo 내부 JavaScript 컨텍스트/상태 관리 제거
• v1 프로젝트와 호환되지 않음

---

🏗 Recommended Project Structure

project-root/
├── src/
│   ├── App.neo
│   ├── state.js
│   └── actions.js
├── index.html
└── vite.config.js (optional)

---

📌 Notes

• Neo v2.1.0은 실험적 릴리즈입니다.
• 대규모 애플리케이션보다는 소규모 / 실험적 UI 프로젝트에 적합합니다.
• 향후 버전에서 중첩 UI, 부분 렌더링 등이 검토될 수 있습니다.

---

📄 License

MIT License