Jupyter + Javascript+ TypeScript => Startup

Try building react site with TypeScript on Jupiter!

Build Image:

Download Node Package:

Download from: 
https://nodejs.org/dist/v16.17.1/node-v16.17.1-linux-x64.tar.xz

Put file: node-v16.17.1-linux-x64.tar.xz to static folder

Create a Dockerfile

##### Image
FROM jupyterhub/k8s-singleuser-sample


##### Set Proxy if you need
USER root
# RUN npm config set registry http://<your company>/repository/npm-all/
# RUN npm set strict-ssl false
ADD ./static /app


##### Install kernel of ts and js
WORKDIR /home/jovyan
RUN npm i -g ijavascript itypescript
RUN ijsinstall
RUN its --install=global 

##### Update Node
# Download from: https://nodejs.org/dist/v16.17.1/node-v16.17.1-linux-x64.tar.xz
WORKDIR /app
RUN tar -C /usr/local --strip-components 1 -xJf node-v16.linux.tar.xz
ENV PATH=/usr/local/bin/:$PATH;/usr/local/bin/node:$PATH;/usr/local/bin/npm:$PATH
RUN node -v
RUN npm update npm
RUN npm version


#####
WORKDIR /home/jovyan

Build a image

docker build -t jupyter-typescript .

Run Container:

docker stop jupyter-ts
docker rm jupyter-ts
docker run -p 8888:8888 -p 3000:3000 -v “$PWD”:/home/jovyan -e JUPYTER_ALLOW_INSECURE_WRITES=true –name jupyter-ts jupyter-typescript

Run APP (Create .ipynb)

Create project by `create-react-app`

%env APPName=demo-app
!echo y | npx create-react-app “$APPName” –template typescript

Start App

!cd “$APPName” && npm start

View you site

http://localhost:3000