Où traces-tu la frontière entre le développement…

La frontière se situe au niveau de l'API. Le backend est responsable de :

La logique métier
La gestion des données (base de données, cache)
L'autorisation et l'authentification (si ce n'est pas externalisé dans un service séparé)
La fourniture de données et de fonctionnalités via l'API (REST, GraphQL, etc.)

Le frontend est responsable de :

L'interface utilisateur (HTML, CSS)
L'interaction avec l'utilisateur (JavaScript/Ruby avec Hotwire/etc.)
La consommation de données et l'appel de fonctions via l'API du backend
La présentation des données reçues du backend

Dans l'approche classique, le backend génère des pages HTML, le frontend ajoute simplement de l'interactivité. En SPA (Single Page Application), la frontière est plus nette, car l'interaction se fait exclusivement via l'API.

Exemple :

# app/controllers/api/users_controller.rb
# Backend : Responsable de récupérer l'utilisateur de la base de données et de formater les données pour le frontend
class Api::UsersController < ApplicationController
  def show
    user = User.find(params[:id])
    render json: user.as_json(only: [:id, :name, :email])
  end
end

// app/javascript/packs/user_profile.js
// Frontend : Responsable de demander des données au backend et de les afficher
document.addEventListener('DOMContentLoaded', () => {
  fetch(`/api/users/${userId}`) // userId obtenu côté frontend
    .then(response => response.json())
    .then(data => {
      document.getElementById('user-name').innerText = data.name;
      document.getElementById('user-email').innerText = data.email;
    });
});

Dans les approches hybrides, comme Hotwire, une partie de la logique de rendu peut être déplacée vers le backend, mais l'interaction repose toujours sur le transfert de données ou de fragments HTML via des protocoles spécifiques (par exemple, Turbo Streams).

# app/controllers/posts_controller.rb
# Backend : Rendu HTML pour Turbo Stream
class PostsController < ApplicationController
  def create
    @post = Post.new(post_params)
    if @post.save
      render turbo_stream: turbo_stream.append(:posts, partial: 'posts/post', locals: { post: @post })
    else
      # Gestion des erreurs
    end
  end

  private

  def post_params
    params.require(:post).permit(:body)
  end
end

<!-- _post.html.erb -->
<!-- Fragment HTML envoyé au frontend via Turbo Stream -->
<div>
  <%= post.body %>
</div>

Principe fondamental : le backend fournit des données et des services, le frontend les consomme et les visualise pour l'utilisateur.

Où traces-tu la frontière entre le développement frontend et backend?