Gde povlačiš granicu između frontend i backend…

Граница пролази на нивоу API-ја. Бекенд је одговоран за:

Бизнис логику
Управљање подацима (база података, кеш)
Авторизацију и аутентификацију (ако нису издвојени у посебну услугу)
Обезбеђивање података и функција преко API-ја (REST, GraphQL итд.)

Фронтенд је одговоран за:

Кориснички интерфејс (HTML, CSS)
Интеракцију са корисником (JavaScript/Ruby са Hotwire итд.)
Коришћење података и позивање функција преко бекенд API-ја
Представљање података добијених од бекенда

У класичном приступу, бекенд генерише HTML странице, а фронтенд додаје интерактивност. У SPA (Single Page Application), граница је јаснија јер интеракција пролази искључиво преко API-ја.

Пример:

# app/controllers/api/users_controller.rb
# Бекенд: Одговоран за добијање корисника из базе података и форматирање података за фронтенд
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
// Фронтенд: Одговоран за захтев података од бекенд и њихово приказивање
document.addEventListener('DOMContentLoaded', () => {
  fetch(`/api/users/${userId}`) // userId се добија на фронтенду
    .then(response => response.json())
    .then(data => {
      document.getElementById('user-name').innerText = data.name;
      document.getElementById('user-email').innerText = data.email;
    });
});

У хибридним приступима, попут Hotwire, део логике рендеринга може бити пребачено на бекенд, али интеракција се и даље гради на преносу података или фрагмената HTML преко специфичних протокола (нпр. Turbo Streams).

# app/controllers/posts_controller.rb
# Бекенд: Рендерује HTML за 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
      # Обрада грешака
    end
  end

  private

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

<!-- _post.html.erb -->
<!-- Фрагмент HTML који се шаље на фронтенд преко Turbo Stream -->
<div>
  <%= post.body %>
</div>

Основни принцип: бекенд пружа податке и сервисе, фронтенд их користи и визуализује за корисника.

Gde povlačiš granicu između frontend i backend razvoja?