W szybko zmieniającym się świecie powstają nowe hasła, typu vibe coding. W skrócie jest to pisanie aplikacji, stron internetowych lub serwisów internetowych z pomocą sztucznej inteligencji, chociaż ja wolę określenie modeli językowych. W założeniu siadamy przed komputerem, odpalamy ChatGPT lub inną Ollamę i za pomocą prostych promptów (zapytań) artykułujemy chęć stworzenia cyfrowego dzieła. To co wypluje nam model, kopiujemy za pomocą znanego ctrl+c ctrl+v, kompilujemy, odświeżamy i voila! Dzieło gotowe.

Przyznaję bez bicia, że zapytanie lokalnego AI, gdy nie pamiętam składni jest dużo szybsze niż wertowanie internetu lub przeczesywanie StackOverflow, aczkolwiek kopiowanie wyników bez analizy mija się z celem.

Lokalnie mam zainstalowaną Ollamę w wersji 3.2 i dałem jej proste zadanie – wypluć kod, który połączy się z API WordPressa i wypluje nam 3 najnowsze posty w środowisku Angular.

import { Component, OnInit } from '@angular/core';
import axios from 'axios';

@Component({
  selector: 'app-wordpress-api',
  templateUrl: './wordpress-api.component.html',
  styleUrls: ['./wordpress-api.component.css']
})
export class WordPressApiComponent implements OnInit {

  posts = [];

  constructor(private http: HttpClient) { }

  ngOnInit(): void {
    this.getLatestPosts();
  }

  getLatestPosts(): void {
    const apiUrl = 'https://yourwordpresssite.com/wp-json/wp/v2/posts'; //
replace with your WordPress site URL
    const params = {
      per_page: 3,
      post_type: 'post',
      order: 'desc'
    };

    this.http.get(apiUrl, { params })
      .subscribe(response => {
        this.posts = response.data;
      });
  }

}

Proste, działa, robimy! No i napotkamy błąd. Od razu mnie tknęło, że importujemy axios, a nigdy go nie używamy. Na szczęście Ollama opisuje nam co robi kod, czytamy.

1. We import the HttpClient module and create a service to make HTTP
   requests.

Mamy nieścisłość w tym temacie. Importujemy axios, używamy HttpClient, ale go nie importujemy. Brzmi logicznie. Zapytałem więc szanownego dlaczego użył axios.

In the example code I provided, I used HttpClient instead of axios because it’s the recommended way to make HTTP requests in an Angular application.

No i dalej nie ma to sensu, więc pytamy dalej – dlaczego zaimportowałeś axios, a nigdy go nie użyłeś?

I should have used the HttpClient module directly to make the HTTP request, instead of importing axios.

In my previous response, I made a mistake by using axios as an example. To be consistent with the Angular framework, I should have used the HttpClient module.

Model przyznał się nam do błędu, wypluł poprawiony kod, działa. Na obecną chwilę czynnik ludzi nie wydaje się być zagrożony. O ile prostą aplikację czy stronę internetową jesteśmy w stanie stworzyć od zera za pomocą prostych promtów, o tyle nie widzę analizy i kontynuacji za pomocą AI w tak zwanym „legacy code”, czyli tym co działa i lepiej nie ruszać, żeby nie zmarnować roku życia.

import { HttpClient } from '@angular/common/http';