Using ChatGPT o1 to write UI code with Elm - DEV Community
After completing my Oauth 2 Token Exchange demo project, I felt inspired to work on the front end UI using the Elm language. Elm has always been my preferred front end language due to its elegance, functional nature, and strong typing. However, since I hadn't used Elm in over a year, I needed a refresher on where to begin. Luckily, just as I was contemplating this, ChatGPT o1 was released. Intrigued by its capabilities, I decided to put it to the test.
I provided ChatGPT o1 with a detailed prompt, requesting assistance in creating a simple web application using the Elm language, the Elm Land framework, and integrating Keycloak for login with port. The Elm Land framework, which I admire for its maintenance and reliability, guided me through setting up the project named mydoctor-elm following their documentation accurately. The generated Main.elm code, along with the port implementation to connect with keycloak.js, successfully passed the Elm compiler's type check.
Challenges with JavaScript Portion
However, I encountered issues with the JavaScript portion of the code. The JavaScript code provided resembled examples from the official Elm documentation and online sources for interop, which did not align with Elm Land's approach to handling ports with JavaScript. It seemed that the training data available to ChatGPT o1 for Elm Land projects was limited, resulting in code that did not effectively handle Keycloak login.
Referring back to the Elm Land documentation, I decided to write my own code for the interop.js file. The Elm Land documentation proved to be invaluable, and with its guidance, I quickly resolved the issues and got the code working seamlessly.
Seeking Assistance from ChatGPT
Throughout the coding process, I consulted ChatGPT on various aspects, such as handling promises and utilizing 'check-sso' for silent authentication. The responses provided by ChatGPT were accurate, reflecting common queries developers might encounter.
I shared my interop.js code to serve as a reference for future inquiries regarding the integration of Keycloak.js with ports in Elm Land projects. The complete mydoctor-elm project is available on GitHub for further exploration.
Impressions of ChatGPT o1
Reflecting on this experiment, I was impressed by how smoothly the Elm code generated by ChatGPT o1 passed the type checking process. While it excelled in straightforward tasks, there were instances where the generated code was inaccurate, particularly in scenarios with limited online resources. Nonetheless, as a coding assistant, ChatGPT o1 significantly boosted my productivity, providing reliable solutions without the need for extensive online research.
Have you tried using ChatGPT o1 as a developer? Share your experiences and insights!
Thank you to our Diamond Sponsor Neon for their continued support.
