Accelerating & Optimizing: Making Organization Website Using React.js & Node.js

Fikri Naufal Maulana, Putra Pebriano Nurba, Muhammad Rizky, Hendra Hendra, Yana Adharani, Nurvelly Rosanty, Sitti Nurbaya Ambo

Abstract


In the digital transformation era, many local and student organizations still face issues related to the lack of professional websites, low digital visibility, and limited IT personnel. This community service project aimed to support these organizations by accelerating and optimizing the development of organizational websites using React.js for front-end interface creation and Node.js as the server-side runtime. Through a series of workshops and technical mentoring conducted during the KKN program at Universitas Muhammadiyah Jakarta, the team implemented a step-by-step approach: from system requirement analysis, project initialization using React CLI, component-based user interface development, integration with Tailwind CSS for styling, to deployment via GitHub Pages. The program enabled participants to directly practice developing responsive, maintainable, and scalable websites that reflect modern web standards. The outcomes show that React.js significantly increases development speed and modularity, while Tailwind CSS enhances visual consistency and ease of use. Community partners gained new skills and were able to independently manage and expand their organizational websites post-program. This activity contributes to improving the digital competency of grassroots organizations and promoting technology adoption for sustainability.

Keywords


React.js; Node.js; Tailwind CSS; organizational website; digital transformation; community service; KKN; web development; digital literacy; technology adoption

References


Direktorat Jenderal Pendidikan Tinggi, Riset, dan Teknologi. (2024). Panduan Kuliah Kerja Nyata Kebangsaan 2024. Available: https://www.dikti.kemdikbud.go.id/epustaka/panduan-kuliah-kerja-nyata-kkn-kebangsaan-2024/

Firnando, M., & Sekarwati, A. K. (2023). Pembuatan website inventaris Toko Berkah Lestari menggunakan React JS dan Firebase. Jurnal Pengembangan Rekayasa dan Teknologi, 1(1). Doi: https://doi.org/10.26623/jprt.v8i2.10690

Kinanti, V. S., Setyadi, R., & Widiasari, L. (2023). Implementasi React JS dalam mengembangkan front-end website PT XYZ. Infoman’s: Jurnal Ilmu‑Ilmu Informatika dan Manajemen, 17(2). Available: https://ejournal.lppmunsap.org/index.php/infomans/article/view/1022

Arif, S., Ali, A. A., Chandani, S., & Shafi, Z. (2025). Exploring the effectiveness of student‑led webinars and workshops as teaching strategies using Kirkpatrick model among MSN students. Journal of Asian Development Studies, 14(1), 399–405. Doi: https://doi.org/10.62345/jads.2025.14.1.30

Chen, S., Thaduri, U. R., & Ballamudi, V. K. R. (2019). Front‑end development in React: An overview. Engineering International, 7(2), 117–126. Doi: https://doi.org/10.18034/ei.v7i2.662

Naresvari, E., & Susetyo, Y. A. (2025). Penerapan JavaScript React pada perancangan front-end website UMKM Jemari Ragil. IT‑Explore: Jurnal Penerapan Teknologi Informasi dan Komunikasi, 4(1), 16–32. Doi: https://doi.org/10.24246/itexplore.v4i1.2025.pp16‑32

Pusat Informasi Kampus Merdeka. (2024). Pengenalan magang mandiri untuk mahasiswa. https://pusatinformasi.kampusmerdeka.kemdikbud.go.id/hc/id/articles/24258768050457

Suryadi, A. N., & Nasirudin. (2022). Rancang Bangun Sistem Informasi Penyewaan Kontrakan Mutiara Berbasis Web. Jurnal Informatika Teknologi dan Sains (JINTEKS), 4(3), 215–219. Doi: https://doi.org/10.51401/jinteks.v4i3.1937

Sekarwati, C. F. A. (2023). Pengembangan front-end website platform survey online menggunakan metodologi Agile Scrum dan React.js. Prosiding Seminar Implementasi Teknologi Informasi dan Komunikasi. Doi: https://doi.org/10.31284/p.semtik.2024-2.6239

Sinulingga, A. R., Sitompul, E. T., & Sitorus, R. (2023). Pemberdayaan masyarakat melalui KKN di Desa Deli Makmur. Jurnal Ilmiah Pengabdian Kepada Masyarakat, 3(1), 12–19. Doi: https://doi.org/10.57248/jilpi.v1i3.97

Siahaan, M., & Vianto, V. O. (2022). Comparative analysis study of front-end JavaScript frameworks performance using Lighthouse tool. Jurnal Mantik, 6(3), 2462–2468. Doi: https://doi.org/10.35335/mantik.v6i3.3131

Wibowo, A. H., Mohamad, B., Djatmika, & Santosa, R. (2024). Designing and assessing experiential learning pedagogy for an intercultural communicative competence training module: a quasi‑experimental study. Frontiers in Education, 9, 1470209. Doi: https://doi.org/10.3389/feduc.2024.1470209


Full Text: PDF

Refbacks

  • There are currently no refbacks.


Copyright (c) 2025 Fikri Naufal Maulana

Creative Commons License
This work is licensed under a Creative Commons Attribution-ShareAlike 4.0 International License.