> For the complete documentation index, see [llms.txt](https://lswkim322.gitbook.io/til/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://lswkim322.gitbook.io/til/til-ml/boostcamp/p-stage-product-serving/part-2/2.1-notebook-voila.md).

# 2.1 프로토타이핑 - Notebook 베이스(Voila)

> 실질적인 프로그래밍을 통한 Voila 익히기 

## 1. Voila

{% embed url="<https://github.com/voila-dashboards/voila>" %}

{% embed url="<https://voila-gallery.org>" %}

### 1.1. Voila 특징

* Voila의 본래 목적은 대시보드이다.
* 별도의 코드 추가없이 실행할 수 있다.
* Jupyter Notebook 결과를 쉽게 웹 형태로 띄울 수 있음
* Ipywidget, Ipyleaflet 등 사용 가능
* Jupyter Notebook의 Extension 있음(=노트북에서 바로 대시보드로 변환 가능)
* Python, Julia, C++ 코드 지원
* 고유한 템플릿 생성 가능
* 너무 쉬운 러닝커브

### 1.2. Installation

```
pip3 install voila

# nodejs 설치필요
apt-get install -y nodejs
apt-get install -y npm
npm install -g n
n latest
node -v

#JupyterLab 사용한다면
jupyter labextension install @jupyter-voila/jupyterlab-preview

#jupyter Notebook이나 Jupyter Server를 사용한다면
jupyter serverextension enable voila --sys-prefix

#nbextension도 사용 가능하도록 하고 싶다면 다음과 같이 설정
voila --enable_nbextensions=True
jupyter notebook --VoilaConfiguration.enable_nbextensions=True
```

## 2. ipywidget

## **Special Mission**

1. Jupyter Notebook으로 만든 마스크 분류 모델을 Voila로 띄워보기
2. ipywidget 공식 문서 읽어보기
3. 데이터 시각화 파트에서 배운 내용과 ipywidget을 사용해 인터랙티브한 대시보드 만들기