diff --git a/assets/app.js b/assets/app.js
index bb0a6aa13842ed71824123a207380477f7f1ce1a..ad65a8390678272ed03af4eb2e20ae3ca6fd735a 100644
--- a/assets/app.js
+++ b/assets/app.js
@@ -1,12 +1,48 @@
 /*
- * Welcome to your app's main JavaScript file!
- *
- * We recommend including the built version of this JavaScript file
- * (and its CSS file) in your base layout (base.html.twig).
- */
+* Welcome to your app's main JavaScript file!
+*
+* We recommend including the built version of this JavaScript file
+* (and its CSS file) in your base layout (base.html.twig).
+*/
 
 // any CSS you import will output into a single css file (app.css in this case)
 import './styles/app.css';
 
 // start the Stimulus application
 import './bootstrap';
+
+import 'tui-calendar';
+
+var Calendar = require('tui-calendar'); /* CommonJS */
+require("tui-calendar/dist/tui-calendar.css");
+
+// If you use the default popups, use this.
+require("tui-date-picker/dist/tui-date-picker.css");
+require("tui-time-picker/dist/tui-time-picker.css");
+
+var calendar = new Calendar('#calendar', {
+    defaultView: 'week',
+    taskView: true,
+  });
+
+calendar.createSchedules([
+    {
+        id: '1',
+        calendarId: '1',
+        title: 'my schedule',
+        category: 'time',
+        dueDateClass: '',
+        start: '2022-02-10T22:30:00+09:00',
+        end: '2022-02-11T02:30:00+09:00'
+    },
+    {
+        id: '2',
+        calendarId: '1',
+        title: 'second schedule',
+        category: 'time',
+        dueDateClass: '',
+        start: '2022-02-11T17:30:00+09:00',
+        end: '2022-02-12T17:31:00+09:00',
+        isReadOnly: true    // schedule is read-only
+    }
+]);
\ No newline at end of file
diff --git a/docker/Dockerfile b/docker/Dockerfile
index b7ca2ea1387b8c4d1ce6bbcd441af8cea2581324..03f496c2a4014ad0c9efb68bfe84020a4cfc8bd5 100644
--- a/docker/Dockerfile
+++ b/docker/Dockerfile
@@ -23,7 +23,10 @@ COPY --from=composer /usr/bin/composer /usr/bin/composer
 RUN apk add --no-cache nginx
 COPY docker/nginx.conf docker/calendar.conf /etc/nginx/
 
+RUN apk add nodejs npm && npm install -g yarn 
+
+
 # COPY --chown=root:root . .
 # RUN composer install --prefer-dist --no-dev --optimize-autoloader
 
-CMD composer install && wait-for-it database:5432 -- bin/console doctrine:migrations:migrate -n && nginx && php-fpm
+CMD composer install && wait-for-it database:5432 -- bin/console doctrine:migrations:migrate -n && yarn install && nginx && yarn encore dev --watch &  php-fpm
diff --git a/libfprint-2-tod1-goodix_0.0.6-0ubuntu1~somerville1_amd64.deb b/libfprint-2-tod1-goodix_0.0.6-0ubuntu1~somerville1_amd64.deb
new file mode 100644
index 0000000000000000000000000000000000000000..f54853796f362ac9e54aef7c645291410c20561d
Binary files /dev/null and b/libfprint-2-tod1-goodix_0.0.6-0ubuntu1~somerville1_amd64.deb differ
diff --git a/templates/calendar/index.html.twig b/templates/calendar/index.html.twig
index ceb38bcfb1f7b63bcfbb9c8e9c807b106edf213b..a365b1103fec34ef25a851f60fe6a8ba13d74693 100644
--- a/templates/calendar/index.html.twig
+++ b/templates/calendar/index.html.twig
@@ -17,4 +17,22 @@
         <li>Your template at <code><a href="{{ '/home/fanevark/step/calendrier/templates/calendar/index.html.twig'|file_link(0) }}">templates/calendar/index.html.twig</a></code></li>
     </ul>
 </div>
+
+<body>
+    <div id="calendar" style"height: 800px;"></div>
+      <div id="menu">
+      <span id="menu-navi">
+        <button type="button" class="btn btn-default btn-sm move-today" data-action="move-today">Today</button>
+        <button type="button" class="btn btn-default btn-sm move-day" data-action="move-prev">
+          <i class="calendar-icon ic-arrow-line-left" data-action="move-prev">Prev</i>
+        </button>
+        <button type="button" class="btn btn-default btn-sm move-day" data-action="move-next">
+          <i class="calendar-icon ic-arrow-line-right" data-action="move-next">Nxt</i>
+        </button>
+      </span>
+      <span id="renderRange" class="render-range"></span>
+    </div>
+</body>
+
+
 {% endblock %}