Pandoc adalah alat yang sangat kuat dan fleksibel untuk konversi dokumen, yang dapat membantu Anda beralih antara berbagai format dokumen dengan mudah. Apakah Anda seorang penulis, akademisi, atau profesional di bidang teknologi, kemampuan untuk mengonversi dokumen dari satu format ke format lain seringkali menjadi kebutuhan yang mendesak.

\
Di era digital saat ini, di mana kolaborasi dan interoperabilitas menjadi semakin penting, memiliki alat yang dapat mengatasi berbagai format dokumen merupakan aset yang sangat berharga.


Dalam tutorial ini, kita akan menjelajahi kemampuan Pandoc dalam mengonversi file dokumen, khususnya dari format .docx ke .html. 

&nbsp;
### **Mengapa memilih Pandoc?**


Pandoc bukan hanya sekadar alat konversi, ia adalah pustaka pemrosesan dokumen yang mendukung berbagai format dokumen mulai dari Markdown, LaTeX, hingga EPUB dan banyak lainnya. Dengan menggunakan Pandoc, Anda bisa dengan mudah mengubah dokumen Word menjadi halaman web HTML yang rapi dan terstruktur, siap untuk dipublikasikan atau dibagikan.

&nbsp;
### **Install Pandoc**

Pandoc support dengan berbagai OS seperti Windows, Linux, MacOS, Docker, dan lain - lain, kita hanya perlu menyesuaikan saja.

&nbsp;
### **Cara menggunakan**

Untuk menggunakan pandoc caranya cukup mudah, buka terminal dan masukan perintah

```shell
pandoc [option]
```

&nbsp;
### **Konversi Docx to HTML**

Berikut ini cara melakukan konversi dari file Docx ke HTML

```shell
pandoc -s input.docx -o output.html
```
&nbsp;
Dalam perintah di atas:

 
*    input.docx adalah nama file Word yang ingin Anda konversi.
*  output.html adalah nama file HTML yang akan dihasilkan.


\
Pada contoh berikut ini saya akan coba melakukan konversi dokumen yang cukup komples dimana didalam dokumen tersebut terdapat rumus matematika.

\
![docx.png](https://mrcodingblog.s3.ap-southeast-1.wasabisys.com/docx_e44718468d.png)

\
**Jalankan Pandoc**

\
Buka terminal dan masukan perintah

```shell
pandoc input.docx --mathml --extract-media=./media  -o output.html
```

* extrac-media adalah lokasi dimana media seperti gambar di export (jika ada)
*  --mathml digunakan supaya rumus matematika di konversi menjadi MathML(Math HTML)

\
Hasil dari konversi diatas adalah seprti berikut ini:

&nbsp;

![pandoc_html.png](https://mrcodingblog.s3.ap-southeast-1.wasabisys.com/pandoc_html_0ccc6f4585.png)


\
Dari gambar diatas, terlihat hasil export HTML sangat mirip dengan apa yang ada di file Docx.


\
Pandoc bukan hanya alat konversi yang berdiri sendiri, tetapi juga alat yang sangat fleksibel dan dapat diintegrasikan dengan berbagai bahasa pemrograman, seperti Python, Go, Node.js, PHP, Rust, dan lainnya. Kemampuan ini membuat Pandoc menjadi pilihan favorit bagi para pengembang yang ingin mengotomatisasi proses konversi dokumen dalam aplikasi mereka.

\
Contoh penggunaan dengan Python

```shell
import pypandoc
output = pypandoc.convert_file('input.docx', 'html', outputfile='output.html')
print(output)
```


&nbsp;




Pada tutorial ini, kita akan belajar bagaimana cara convert file dokumen Docx menjadi HTML secara cepat dan mudah dengan menggunakan Pandoc

large_bg-pandoc.jpg

medium_bg-pandoc.jpg

small_bg-pandoc.jpg

thumbnail_bg-pandoc.jpg

bg-pandoc.jpg

Convert Docx FIle To HTML Support Math Equation Using Pandoc

Pada tutorial kali ini, kita akan belajar bagaimana melakukan Dockerize aplikasi Next JS dengan mode Standalone.

&nbsp;
### Apa itu mode standalone?

\
Mode standalone adalah proses build next js dimana akan mengoptimalkan hasil build dengan membuang node_modules dan hanya menggunakan library yang dibutuhkan saja dan di convert menjadi static file.

\
Dengan menggunakan standalone ukuran aplikasi akan menjadi lebih kecil sampai 80%

\
Jika kita ingin menjalankan aplikasi Next JS kita sebagai container maka menggunakan mode standalone akan sangat membantu mengurangi size dari container.

&nbsp;
### Install Next JS

\
Kita akan menginstall Next JS terlebih dahulu, jalankan perintah dibawah dan buat nama project misalnya "next-standalone"

&nbsp;
```shell
npx create-next-app@latest

```

\
Lalu masuk kedalam folder "next-standalone" kemudian edit file **next.config.js** tambahkan output

&nbsp;
```javascript
/** @type {import('next').NextConfig} */
const nextConfig = {
    output: 'standalone',
};

export default nextConfig;

```

\
Kemudian buat file Dockerfile

```shell
FROM node:18-alpine AS base

 
FROM base AS builder
RUN apk add --no-cache libc6-compat
RUN apk update
# Set working directory
WORKDIR /app
COPY . .
 
# Add lockfile and package.json's of isolated subworkspace
FROM base AS installer
RUN apk add --no-cache libc6-compat
RUN apk update
WORKDIR /app
 
# First install the dependencies (as they change less often)
COPY .gitignore .gitignore
COPY --from=builder /app/package.json .
RUN yarn install
 
# Build the project
COPY --from=builder /app/ .
RUN yarn build
 
FROM base AS runner
WORKDIR /app
 
 
# Don't run production as root
RUN addgroup --system --gid 1001 nodejs
RUN adduser --system --uid 1001 nextjs
USER nextjs
 
COPY --from=installer /app/next.config.mjs .
COPY --from=installer /app/package.json .
# COPY --from=installer /app/.env.production .
 
# Automatically leverage output traces to reduce image size
# https://nextjs.org/docs/advanced-features/output-file-tracing
COPY --from=installer --chown=nextjs:nodejs /app/.next/standalone ./
COPY --from=installer --chown=nextjs:nodejs /app/.next/static ./.next/static
COPY --from=installer --chown=nextjs:nodejs /app/public ./public

EXPOSE 3000

CMD node server.js 
```

\
Kemudian jalankan perintah


```shell
docker build -t next-standalone .
```

\
Setelah berhasil, kemudian testing dengan menjalankan perintah

```shell
docker run -it --rm -p 3000:3000 next-standalone
```

\
Kemudian akses broswer http://localhost:3000

![next.png](https://mrcodingblog.s3.ap-southeast-1.wasabisys.com/next_fecc7b40c4.png)

\
Berikut ini perbandingan ukuran container jika tanpa mode standalalone dan menggunakan mode standalone:


```shell
| No Standalone  |  With Standalone Mode |
| 500MB  |  100MB |
```

\
Ukuran diatas hanya perbandingan next js tanpa menggunakan library tambahan seperti Chakra UI, Taildwind CSS

Dockerize aplikasi Next JS dengan Mode Standalone dengan ukuran yang lebih kecil

large_next.png

medium_next.png

small_next.png

thumbnail_next.png

next.png

Next jS Dockerize for Production With Standalone Mode

Pertama install Next JS terlebih dahulu.

Jalankan perintah

```
npx create-next-app@latest
```

\
Lalu isi nama project dengan nama misalnya "next-https"

\
Kemudian masuk kedalam project lalu jalankan perintah

```
yarn dev
```

\
Lalu buka browser untuk memastikan

\
![h7XmUpL.png](https://mrcodingblog.s3.ap-southeast-1.wasabisys.com/h7_Xm_Up_L_bd293ddbe6.png)


\
Untuk menjalankan dengan HTTPS caranya cukup mudah, jalankan perintah

```
yarn dev --experimental-https
```

\
Kemudian buka browser dan gunakan https

\
![80JWiiW.png](https://mrcodingblog.s3.ap-southeast-1.wasabisys.com/80_J_Wii_W_725dcc2b82.png)

Pada tutorial kali ini saya akan membagikan cara mudah menjalankan Next JS dilocalhost dengan Https

Kelas tidak ditemukan