What is Project IDX?

Project IDX is a cloud-based, integrated development environment (IDE), an entirely web-based workspace created by Google that helps users build multiplatform applications. It is designed to make the app development process faster and easier.

Some key features that make this project tempting are:

• Cloud-Based: Project IDX workspace runs in the cloud, a browser-based solution that eliminates the need for local installation and setups
• AI-Powered: Google’s Gemini Artificial Intelligence (AI) is used for code generation, assistance, and code suggestions
• Template Support: The workspace includes a large variety of templates for frameworks such as Angular, Flutter, Go, and React
• Integrated Development Environment (IDE): The workspace provides a familiar development environment with features, including code editing, debugging, and version control.
• Emulators: The workspace includes Android, iOS, and Web Emulator integrations
• Ease of Use: The tool is designed to be user-friendly and accessible to developers of all levels

Available Templates

Their templates are broken down into sections:

• Web App: Angular, Next.js, Astro, React, Simple HTML, Svelte, Vue.js, SolidJS, Preact, Nuxt, React + Google Maps Platform
• Backend: Go, Python (Python Flask, Python Django), Node Express, Rust, Laravel, Python Django, Gemini Application Programming Interface (API), .Net, Java, Dart, C++, Ruby, PHP
• Mobile: Flutter, React Native + Expo
• AI & ML: Gemini API, LangChain with Gemini, Firebase Genkit, IDX Agents
• Database: Postgres, MySQL, Prisma, MongoDB, Firebase Data Connect
• Misc: Blank Workspace, React + Google Maps Platform, Firebase Data Connect

Findings with my Project IDX exploration

Using The React Template 

I used React for web development (a powerful JavaScript library) on a single project. After selecting the template from the IDX Dashboard and creating the project name, the project itself took less than a minute to be created with basic content and was ready for development. I tried to use Gemini’s AI heavily as this is one of the key features Project IDX offers.

I asked the AI to create a calculator application with a modern look for a given file. This created a simple yet working calculator with no issues in seconds. I continued giving it prompts to improve the logic and design. Most of the time this worked fine and was updating the correct content as given by the prompt. 

Other times, it had difficulties updating the user interface (UI) colors and shapes. This is when I had to go in and make adjustments to the logic and the styles.

Overall I had a decent experience using Google’s Gemini AI to generate and create the calculator application. 

Here are some screenshots of the final outcome after 15-20 prompts with no hands-on development except for fixing and updating minor UI mistakes.

Using a Flutter Template

I tested the Flutter framework in four different projects. I aimed to test the three main operating systems for Flutter: iOS, Android, and Web. When I tested there was no iOS simulator accessible and after some research, I found that this was available but was taken down at some point. On the bright side, it looks like it will be coming back at a later time. This leaves us with the Android and Web simulators to test.

For the first project, I tested Github integration, which needs to be done through the IDE’s command-line interface and a generated token giving provisional access fetched from GitHub. This worked fine and I was able to push the starting code and new changes to GitHub. After further development and adding new Flutter libraries the Android simulator stopped working and I was unable to make it work again even after redoing changes leaving me stranded. There were no useful errors telling what the problem was, only that the Gradle task assembleDebug failed. I could not find any debugging features for the Android Simulator. On the bright side, the web simulator worked at all times. At this point, I proceeded to create a new project and kept on testing Project IDX. 

On the second project, I tested Firebase integration which also has to be done through the command-line interface. The initial integration worked fine and successfully linked the project with Firebase. After integrating some Firebase Flutter libraries and adding some initial code to test the connection and see if data was being saved in Firebase. I ran into a similar issue as project one, where the Android simulator stopped working and was not usable. The Web simulator kept on working and at some points, it crashed as well. Similarly to project one, there was no way of making the Android simulator run and I had to start a new project.

For the third project, I created a simple login and registration UI screen using Gemini’s AI. This generated a successful single screen with two text fields one for the email address, the second for the password, and a button to login or register. Since I never specified to create two different screens for registration and login, it combined them into a single one. I kept this project as a working example with no APIs or additional libraries since the Android simulator in the two previous projects stopped working.

On the fourth and final project, I used AI API integrations to test how it reacted to exterior calls.  I used Llama (Meta’s AI) to create a chatbot, you would write a prompt and it would respond back with some output. This was straightforward to set up using the Groq API and its key. Since this required a key, I tried using the ‘Flutter_dotenv’ library which is a common library to use to hide global variables using a ‘.env’ file. This implementation made the Android simulator crash; fortunately, I was able to redo this and have it working once again. After careful testing, I concluded that Project IDX IDE does not support this library. Debugging this issue was not the easiest but I narrowed it down to it. This leaves some security issues out since the key would need to be hardcoded somewhere in the project which can lead to key leakage and security vulnerabilities. 

I also used Pollination’s AI to generate images from prompts. Since this API only uses a Uniform Resource Locator (URL) and the prompt, there were no issues while implementing it. This API lets us send a prompt in the URL and receive an image to display with that same URL. The setup was straightforward and did not have any issues with the simulator or the application in general. 

I used the Pollination’s AI for an additional screen where it shows 16 images generated from multiple calls to this API. In most cases, it returned an image but in some others, it was an error that we exchanged for an icon. This may also be due to us sending characters and numbers not solid sentences or words.

Project IDX Strengths and Weaknesses

Strengths

• Effortless Onboarding: Get started quickly and easily without the hassle of local setups.
• Enhanced Collaboration: Seamlessly share projects with colleagues and work together effectively, regardless of location.
• Cloud-Based Development: Develop and iterate on projects from anywhere with an internet connection, freeing you from the constraints of your local machine.
• Streamlined Development: Leverage pre-built templates to kickstart your projects and accelerate development timelines.
• AI-Powered Productivity: Utilize the integrated AI tool to generate code, answer questions, and make instant file changes, significantly boosting your development efficiency.

Weaknesses

• Platform Incompatibility: While Project IDX has some multiplatform compatibility, it currently lacks support for iOS development within the Flutter framework.
• Instability Issues: Frequent crashes were observed on the Android emulator. Experiences intermittent unresponsiveness, requiring browser refreshes and browser restarts to regain functionality, negatively impacting productivity.
• Debugging Challenges: Troubleshooting issues can be complex and time-consuming due to the platform’s limitations.
• Limited User Experience: Lacks essential features such as right-click functionality when the emulator is not working, hindering user interaction and productivity.
• Common Error Messages that randomly pop out, fixed by refreshing the tab:

• Problems accessing projects; fixed it by restarting the browser:

Next steps for Project IDX

As a cloud-enabled, browser-based development workspace, Project IDX seems to be a good choice at first glance with all that it offers and the ease of use. However, it does not meet the requirements for an actual project due to some of its platform limitations and lag of debugging tools. 

Project IDX was easy to learn as it does most of the work needed to get started. The rest is the actual development and feature implementation. I really liked the fact that you can ask a question to Gemini and it fills out the file with the response and you can even edit before applying the changes. The preview of the code lacks some viewing capabilities as most of the time it’s cut off and hard to read before it is implemented. 

I see a powerful use case for the technology being when one wants to do a quick demo or a testing application. This way if you are on a different computer or just want to test new changes, you can easily do it without the hassle of downloading Flutter into your system and waiting for the download and setting up time. 

If I were to develop an actual project with this I can see this working on a project that does not use many libraries and is mainly UI in projects such as a task manager, list of items, static content, etc.

I used Project IDX to create multiple demos and see its limitations—implementing Firebase and Github for example. I created a calculator using the React framework. I also created a login screen, and used some AI APIs to generate content, communicate, and display its output using the Flutter Framework. I could mainly do simple things without breaking the Android simulator. I was not able to debug or see what I was logging in my functions on the output window. However, I understand that this is the beta version of Project IDX and it will continue to evolve.  

I believe Project IDX has the potential to be a game-changer for developers around the world, challenging IDE competitors like Visual Studio Code (VS Code), VSCodium, and Sublime Text. I am really excited to see where Project IDX goes from here, as its feature set and multiplatform compatibility inevitably expand.