
Codex : La Formation Complète pour Coder avec l'IA d'OpenAI
Audio Summary
AI Summary
This video introduces Codex, a user-friendly tool for writing code that can be used by both developers and non-developers. The tutorial outlines several essential, free tools that developers commonly use, emphasizing their importance and ease of installation.
The first step is to download and install Codex. The installation process is described as straightforward, with the installer opening automatically. Following this, users will need to install Node.js and npm. All necessary links will be provided in the description, and the instructions are applicable for both Windows and Mac users. The presenter, using Windows, proceeds to download the Windows installer.
While Node.js and npm are downloading, an explanation of npm is provided. When developing projects like applications or websites, new functionalities are often required. There are two approaches: coding everything from scratch, which is rarely done, or utilizing existing libraries. These free libraries save time by preventing the need to "reinvent the wheel." Npm is crucial for installing these libraries into a project, and Codex relies on it to function.
The installation of Node.js is then demonstrated, involving continuous clicking of "Next" and leaving the default directory. The presenter suggests clicking an option to install Chocolatey, finding it potentially useful.
After these installations, users must create a GitHub account. GitHub is explained as a version control system for projects. It allows users to create multiple versions of their project, such as a base version, then version 2 with a homepage, version 3 with a menu, and so on. This is vital for beginners using Codex or similar tools, as it allows them to revert to previous versions if a mistake or an AI error corrupts the project. GitHub also provides an online backup of the project, protecting against data loss if a computer fails, and maintains a complete history of changes, which the AI manages effectively.
Next, Git needs to be installed directly on the computer. Again, the link is in the description, and users select their operating system (Windows, Mac, or Linux). The presenter downloads the standalone installer for Windows. The installation involves mostly clicking "Next," as default settings are generally well-configured.
With all installations complete, users are directed to chat.openai.com. To use Codex, a minimum subscription of 23 euros per month (the "Plus" offer) is required. Once on Codex, users can access Settings to connect their ChatGPT account. While a detailed tutorial on the Codex interface isn't provided, the emphasis is on practical application.
Before diving into coding, plugins are essential. The presenter has added the Vercel plugin for deploying applications, making them publicly accessible, and the GitHub plugin for versioning work and reverting changes if bugs occur. The video will also cover creating automations later.
Similar to other platforms, Codex offers "skills." Adding a "front-end" skill is suggested for designing more professional-looking pages, especially for creating a website.
The practical demonstration begins by creating a new work folder on the desktop, for example, named "restaurant" to build a website for a Michelin-starred restaurant called "Chez Ben." This folder is then added to the Codex project by clicking an icon within Codex and selecting the newly created folder.
The prompt for Codex is then formulated: "Create in Next.js, TypeScript, Chat CN, the website for a Michelin-starred restaurant called 'Chez Ben.' I will need several pages: a home page, a menu page, a team page, and a contact page." The presenter notes that for professional projects, more detailed information in the prompt is better. For the model settings, "5.4" is selected, and "high reasoning" is chosen due to the complexity of the task, though "very high reasoning" isn't deemed necessary.
Codex begins its work, occasionally requesting authorization to run commands, particularly npm commands to install libraries. Users are advised to consistently grant these permissions. The process can take a significant amount of time (the presenter's example took about 40 minutes).
Once completed, the application can be launched. Developers could also use "npm run dev" via a setup action, but Codex handles it automatically. The launched application displays the "Restaurant Chez Ben" homepage, menu, team, and contact pages. While the design could be improved, it's a decent start. The menu items are invented since no specific menu was provided.
Modifications are demonstrated by asking Codex to remove the reservation form from the contact page. This illustrates how users can interact with Codex to refine the site, change colors, or address other issues. After the change, the reservation form is indeed gone, confirming the modification. Further adjustments to details like email reservation field size, colors, and accessibility would still be needed for a polished site.
Next, the project is versioned using GitHub. Users navigate to their GitHub profile, create a new repository, give it a name, and set its visibility to private. The URL of this new repository is then copied. Back in Codex, the command "commit and push to Git. The repo is at the following URL" is given, with the copied URL. This action adds the current version of the website to the Git repository. The presenter confirms the project is on GitHub by refreshing the GitHub page. It's recommended to commit and push after every modification to maintain a history of changes, allowing for easy rollback if issues arise.
Finally, the application is deployed using Vercel, making it accessible to everyone online. Users are encouraged to create a Vercel account, ideally logging in with their GitHub account. The process involves authorizing Vercel to link with the GitHub account and access the relevant repository (in this case, the "restaurant" repository). The workflow is explained: developers push code to GitHub, which stores the source code, and Vercel then connects to this source code to automatically deploy the application. Within Codex, the command "Deploy the application with Vercel" is given, leveraging the previously added Vercel plugin. The deployment is successful, and the application is now live and publicly accessible. Users are advised to ask Codex for help if any issues arise during deployment.
The video then moves on to creating an automation. The presenter asks Codex to create an automation that analyzes the website's SEO and provides a report, scheduled to run every Monday morning. Codex successfully creates this automation, set to run at 8 AM each Monday, and even suggests a second automation.
The final segment explores interacting with Codex directly through code editors like VS Code, which is where real developers work. For those without VS Code, downloading it is recommended. Once installed, users can right-click their application folder and select "Open with Code" to access the application's code and see what Codex has generated. For non-developers, this part might seem complex, but practicing it is encouraged to elevate one's skill level.
To use Codex within VS Code, users open a new terminal and run "npm install -g @openai/codex" to install Codex as a command-line interface (CLI) tool. Once installed, simply typing "codex" in the terminal launches Codex. Users can change the model by typing "model" and can perform all the same actions as in the Codex software directly within the terminal. This allows for direct interaction with specific parts of the code, such as telling Codex to modify the contact page. The presenter suggests that further exploration of the Codex CLI could be the subject of a future video. The video concludes by encouraging viewers to like, comment, and share.