diff --git a/backend/src/cms_backend/api/main.py b/backend/src/cms_backend/api/main.py
index b9954eb..6ee91c1 100644
--- a/backend/src/cms_backend/api/main.py
+++ b/backend/src/cms_backend/api/main.py
@@ -19,6 +19,7 @@
 from cms_backend.api.routes.http_errors import BadRequestError
 from cms_backend.api.routes.staging import router as staging_router
 from cms_backend.api.routes.titles import router as titles_router
+from cms_backend.api.routes.warehouse import router as warehouse_router
 from cms_backend.api.routes.zimfarm_notifications import (
     router as zimfarm_notification_router,
 )
@@ -74,6 +75,7 @@ def create_app(*, debug: bool = True):
     main_router.include_router(router=auth_router)
     main_router.include_router(router=account_router)
     main_router.include_router(router=staging_router)
+    main_router.include_router(router=warehouse_router)
 
     app.include_router(router=main_router)
 
diff --git a/backend/src/cms_backend/api/routes/collection.py b/backend/src/cms_backend/api/routes/collection.py
index 25b3882..0d434ee 100644
--- a/backend/src/cms_backend/api/routes/collection.py
+++ b/backend/src/cms_backend/api/routes/collection.py
@@ -5,21 +5,31 @@
 import xxhash
 from fastapi import APIRouter, Depends, Path, Query
 from fastapi.responses import Response
+from pydantic import AnyUrl, Field
 from sqlalchemy.orm import Session as OrmSession
 
-from cms_backend.api.routes.fields import LimitFieldMax200, SkipField
+from cms_backend.api.routes.dependencies import require_permission
+from cms_backend.api.routes.fields import LimitFieldMax200, NotEmptyString, SkipField
 from cms_backend.api.routes.models import ListResponse, calculate_pagination_metadata
 from cms_backend.api.routes.utils import build_library_xml
 from cms_backend.db import gen_dbsession
+from cms_backend.db.collection import create_collection as db_create_collection
 from cms_backend.db.collection import (
-    get_collection,
+    create_collection_full_schema,
     get_collection_by_name_or_none,
     get_latest_books_for_collection,
 )
+from cms_backend.db.collection import get_collection as db_get_collection
+from cms_backend.db.collection import (
+    get_collection_by_name as db_get_collection_by_name,
+)
 from cms_backend.db.collection import get_collections as db_get_collections
+from cms_backend.db.collection import update_collection as db_update_collection
 from cms_backend.db.exceptions import RecordDoesNotExistError
 from cms_backend.schemas import BaseModel
-from cms_backend.schemas.orms import CollectionLightSchema
+from cms_backend.schemas.models import CollectionUpdateSchema
+from cms_backend.schemas.orms import CollectionFullSchema, CollectionLightSchema
+from cms_backend.utils import is_valid_uuid
 
 router = APIRouter(prefix="/collections", tags=["collections"])
 
@@ -27,16 +37,19 @@
 class CollectionsGetSchema(BaseModel):
     skip: SkipField = 0
     limit: LimitFieldMax200 = 20
+    name: NotEmptyString | None = None
 
 
 @router.get("")
-async def get_collections(
+def get_collections(
     params: Annotated[CollectionsGetSchema, Query()],
     session: Annotated[OrmSession, Depends(gen_dbsession)],
 ) -> ListResponse[CollectionLightSchema]:
     """Get a list of collections"""
 
-    results = db_get_collections(session, skip=params.skip, limit=params.limit)
+    results = db_get_collections(
+        session, skip=params.skip, limit=params.limit, name=params.name
+    )
 
     return ListResponse[CollectionLightSchema](
         meta=calculate_pagination_metadata(
@@ -49,6 +62,71 @@ async def get_collections(
     )
 
 
+class CollectionCreateSchema(BaseModel):
+    name: NotEmptyString = Field(min_length=3)
+    warehouse_name: NotEmptyString = Field(min_length=3)
+    download_base_url: AnyUrl | None = None
+    view_base_url: AnyUrl | None = None
+
+
+@router.post(
+    "",
+    dependencies=[Depends(require_permission(namespace="collection", name="create"))],
+)
+def create_collection(
+    session: Annotated[OrmSession, Depends(gen_dbsession)],
+    request: CollectionCreateSchema,
+):
+    """Create a collection"""
+    return create_collection_full_schema(
+        db_create_collection(
+            session,
+            name=request.name,
+            warehouse_name=request.warehouse_name,
+            download_base_url=(
+                str(request.download_base_url)
+                if request.download_base_url is not None
+                else None
+            ),
+            view_base_url=(
+                str(request.view_base_url)
+                if request.view_base_url is not None
+                else None
+            ),
+        )
+    )
+
+
+@router.get("/{collection_id_or_name}")
+def get_collection(
+    collection_id_or_name: Annotated[str, Path()],
+    session: Annotated[OrmSession, Depends(gen_dbsession)],
+):
+    """Get collection by collection ID (UUID) or name."""
+    if is_valid_uuid(collection_id_or_name):
+        collection = db_get_collection(session, UUID(collection_id_or_name))
+    else:
+        collection = db_get_collection_by_name(session, collection_id_or_name)
+    return create_collection_full_schema(collection)
+
+
+@router.patch(
+    "/{collection_id_or_name}",
+    dependencies=[Depends(require_permission(namespace="collection", name="update"))],
+)
+def update_collection(
+    collection_id_or_name: Annotated[str, Path()],
+    collection_data: CollectionUpdateSchema,
+    session: OrmSession = Depends(gen_dbsession),
+) -> CollectionFullSchema:
+    """Update a collectio's data"""
+    return create_collection_full_schema(
+        db_update_collection(
+            session, collection_id=collection_id_or_name, request=collection_data
+        )
+    )
+
+
 def _get_catalog_xml_content(
     collection_id_or_name: str, session: OrmSession
 ) -> tuple[str, int]:
@@ -57,7 +135,7 @@ def _get_catalog_xml_content(
     try:
         collection_id = UUID(collection_id_or_name)
         try:
-            collection = get_collection(session, collection_id)
+            collection = db_get_collection(session, collection_id)
         except RecordDoesNotExistError:
             pass
     except ValueError:
@@ -78,7 +156,7 @@ def _get_catalog_xml_content(
 
 
 @router.get("/{collection_id_or_name}/catalog.xml")
-async def get_library_catalog_xml(
+def get_library_catalog_xml(
     collection_id_or_name: Annotated[str, Path()],
     session: Annotated[OrmSession, Depends(gen_dbsession)],
 ):
@@ -95,7 +173,7 @@ async def get_library_catalog_xml(
 
 
 @router.head("/{collection_id_or_name}/catalog.xml")
-async def head_library_catalog_xml(
+def head_library_catalog_xml(
     collection_id_or_name: Annotated[str, Path()],
     session: Annotated[OrmSession, Depends(gen_dbsession)],
 ):
diff --git a/backend/src/cms_backend/api/routes/fields.py b/backend/src/cms_backend/api/routes/fields.py
index 2eb1297..b412b80 100644
--- a/backend/src/cms_backend/api/routes/fields.py
+++ b/backend/src/cms_backend/api/routes/fields.py
@@ -1,6 +1,5 @@
 from typing import Annotated, Any
 
-import regex
 from pydantic import (
     AfterValidator,
     Field,
@@ -10,16 +9,6 @@
 )
 
 
-class GraphemeStr(str):
-    def __len__(self) -> int:
-        # Count the number of grapheme clusters
-        return len(regex.findall(r"\X", self))
-
-
-def to_grapheme_str(value: str):
-    return GraphemeStr(value)
-
-
 def no_null_char(value: str) -> str:
     """Validate that string value does not contains Unicode null character"""
     if "\u0000" in value:
@@ -46,9 +35,7 @@ def not_empty(value: str) -> str:
     return value.strip()
 
 
-NoNullCharString = Annotated[
-    str, AfterValidator(no_null_char), AfterValidator(to_grapheme_str)
-]
+NoNullCharString = Annotated[str, AfterValidator(no_null_char)]
 
 NotEmptyString = Annotated[NoNullCharString, AfterValidator(not_empty)]
 
diff --git a/backend/src/cms_backend/api/routes/titles.py b/backend/src/cms_backend/api/routes/titles.py
index 839f8c2..9ba7f31 100644
--- a/backend/src/cms_backend/api/routes/titles.py
+++ b/backend/src/cms_backend/api/routes/titles.py
@@ -30,6 +30,7 @@ class TitlesGetSchema(BaseModel):
     skip: SkipField = 0
     limit: LimitFieldMax200 = 20
     name: NotEmptyString | None = None
+    collection_name: NotEmptyString | None = None
 
 
 class BaseTitleCreateUpdateSchema(BaseModel):
@@ -70,6 +71,7 @@ def get_titles(
         skip=params.skip,
         limit=params.limit,
         name=params.name,
+        collection_name=params.collection_name,
     )
     return ListResponse[TitleLightSchema](
         meta=calculate_pagination_metadata(
diff --git a/backend/src/cms_backend/api/routes/warehouse.py b/backend/src/cms_backend/api/routes/warehouse.py
new file mode 100644
index 0000000..fd2d0cf
--- /dev/null
+++ b/backend/src/cms_backend/api/routes/warehouse.py
@@ -0,0 +1,30 @@
+from typing import Annotated
+
+from fastapi import APIRouter, Depends, Query
+from sqlalchemy.orm import Session as OrmSession
+
+from cms_backend.api.routes.dependencies import gen_dbsession
+from cms_backend.api.routes.fields import LimitFieldMax200, SkipField
+from cms_backend.api.routes.models import ListResponse, calculate_pagination_metadata
+from cms_backend.db.warehouse import get_warehouses as db_get_warehouses
+
+router = APIRouter(prefix="/warehouses", tags=["warehouses"])
+
+
+@router.get("")
+def get_warehouses(
+    session: OrmSession = Depends(gen_dbsession),
+    skip: Annotated[SkipField, Query()] = 0,
+    limit: Annotated[LimitFieldMax200, Query()] = 200,
+):
+    """Get a list of warehouses"""
+    result = db_get_warehouses(session, skip=skip, limit=limit)
+    return ListResponse(
+        items=result.records,
+        meta=calculate_pagination_metadata(
+            nb_records=result.nb_records,
+            skip=skip,
+            limit=limit,
+            page_size=len(result.records),
+        ),
+    )
diff --git a/backend/src/cms_backend/db/collection.py b/backend/src/cms_backend/db/collection.py
index eb029f4..297f8b8 100644
--- a/backend/src/cms_backend/db/collection.py
+++ b/backend/src/cms_backend/db/collection.py
@@ -2,7 +2,7 @@
 from typing import NamedTuple, cast
 from uuid import UUID
 
-from sqlalchemy import and_, func, select
+from sqlalchemy import and_, func, select, update
 from sqlalchemy.orm import Session as OrmSession
 
 from cms_backend.db import count_from_stmt
@@ -14,7 +14,14 @@
     CollectionTitle,
     Title,
 )
-from cms_backend.schemas.orms import CollectionLightSchema, ListResult
+from cms_backend.db.warehouse import get_warehouse
+from cms_backend.schemas.models import CollectionUpdateSchema
+from cms_backend.schemas.orms import (
+    CollectionFullSchema,
+    CollectionLightSchema,
+    ListResult,
+)
+from cms_backend.utils import is_valid_uuid
 
 
 def get_collection_or_none(session: OrmSession, library_id: UUID) -> Collection | None:
@@ -125,7 +132,7 @@ def get_latest_books_for_collection(
 
 
 def get_collections(
-    session: OrmSession, *, skip: int, limit: int
+    session: OrmSession, *, name: str | None = None, skip: int, limit: int
 ) -> ListResult[CollectionLightSchema]:
     """Get the list of collections."""
     stmt = (
@@ -139,8 +146,19 @@ def get_collections(
                 [],
             ).label("paths"),
         )
+        .where(
+            # If a client provides an argument i.e it is not None,
+            # we compare the corresponding model field against the argument,
+            # otherwise, we compare the argument to its default which translates
+            # to a SQL true i.e we don't filter based on this argument (a no-op).
+            (
+                Collection.name.ilike(f"%{name if name is not None else ''}%")
+                | (name is None)
+            ),
+        )
         .outerjoin(CollectionTitle)
         .group_by(Collection.id)
+        .order_by(Collection.name.desc())
     )
 
     return ListResult[CollectionLightSchema](
@@ -156,3 +174,52 @@ def get_collections(
             ).all()
         ],
     )
+
+
+def create_collection_full_schema(collection: Collection) -> CollectionFullSchema:
+    return CollectionFullSchema(
+        id=collection.id,
+        warehouse=collection.warehouse.name,
+        name=collection.name,
+        download_base_url=collection.download_base_url,
+        view_base_url=collection.view_base_url,
+    )
+
+
+def create_collection(
+    session: OrmSession,
+    *,
+    name: str,
+    warehouse_name: str,
+    download_base_url: str | None = None,
+    view_base_url: str | None,
+) -> Collection:
+    warehouse = get_warehouse(session, warehouse_name)
+    collection = Collection(
+        name=name,
+        download_base_url=download_base_url,
+        view_base_url=view_base_url,
+        warehouse_id=warehouse.id,
+    )
+    session.add(collection)
+    session.flush()
+    return collection
+
+
+def update_collection(
+    session: OrmSession, *, collection_id: str, request: CollectionUpdateSchema
+) -> Collection:
+    """Update a collection"""
+    if is_valid_uuid(collection_id):
+        collection = get_collection(session, UUID(collection_id))
+    else:
+        collection = get_collection_by_name(session, collection_id)
+    values = request.model_dump(exclude_unset=True)
+    if not values:
+        return collection
+
+    session.execute(
+        update(Collection).values(**values).where(Collection.id == collection.id)
+    )
+    session.refresh(collection)
+    return collection
diff --git a/backend/src/cms_backend/db/models.py b/backend/src/cms_backend/db/models.py
index e237b1a..54c69f7 100644
--- a/backend/src/cms_backend/db/models.py
+++ b/backend/src/cms_backend/db/models.py
@@ -253,7 +253,7 @@ class Warehouse(Base):
     id: Mapped[UUID] = mapped_column(
         init=False, primary_key=True, server_default=text("uuid_generate_v4()")
     )
-    name: Mapped[str]
+    name: Mapped[str] = mapped_column(unique=True, index=True)
 
     collections: Mapped[list["Collection"]] = relationship(
         back_populates="warehouse",
diff --git a/backend/src/cms_backend/db/title.py b/backend/src/cms_backend/db/title.py
index 28776cc..0d13fc9 100644
--- a/backend/src/cms_backend/db/title.py
+++ b/backend/src/cms_backend/db/title.py
@@ -19,6 +19,7 @@
 from cms_backend.db.exceptions import RecordAlreadyExistsError, RecordDoesNotExistError
 from cms_backend.db.models import (
     Book,
+    Collection,
     CollectionTitle,
     Title,
 )
@@ -121,6 +122,7 @@ def get_titles(
     limit: int,
     name: str | None = None,
     omit_names: list[str] | None = None,
+    collection_name: str | None = None,
 ) -> ListResult[TitleLightSchema]:
     """Get a list of titles"""
 
@@ -130,6 +132,8 @@ def get_titles(
             Title.name.label("title_name"),
             Title.maturity.label("title_maturity"),
         )
+        .join(CollectionTitle, CollectionTitle.title_id == Title.id, isouter=True)
+        .join(Collection, CollectionTitle.collection_id == Collection.id, isouter=True)
         .order_by(Title.name)
         .where(
             # If a client provides an argument i.e it is not None,
@@ -141,6 +145,12 @@ def get_titles(
                 | (name is None)
             ),
             (Title.name.not_in(omit_names or []) | (omit_names is None)),
+            (
+                Collection.name.ilike(
+                    f"%{collection_name if collection_name is not None else ''}%"
+                )
+                | (collection_name is None)
+            ),
         )
     )
 
diff --git a/backend/src/cms_backend/db/warehouse.py b/backend/src/cms_backend/db/warehouse.py
new file mode 100644
index 0000000..30205ba
--- /dev/null
+++ b/backend/src/cms_backend/db/warehouse.py
@@ -0,0 +1,52 @@
+from sqlalchemy import func, select
+from sqlalchemy.orm import Session as OrmSession
+
+from cms_backend.db.exceptions import RecordDoesNotExistError
+from cms_backend.db.models import Warehouse
+from cms_backend.schemas.orms import ListResult
+
+
+def get_warehouse_or_none(session: OrmSession, warehouse_name: str) -> Warehouse | None:
+    """Get a warehouse by name or None."""
+    return session.scalars(
+        select(Warehouse).where(Warehouse.name == warehouse_name)
+    ).one_or_none()
+
+
+def get_warehouse(session: OrmSession, warehouse_name: str) -> Warehouse:
+    """Get a warehouse by name if possible else raise an exception"""
+    if (
+        warehouse := get_warehouse_or_none(session, warehouse_name=warehouse_name)
+    ) is None:
+        raise RecordDoesNotExistError(
+            f"Warehouse with name {warehouse_name} does not exist"
+        )
+    return warehouse
+
+
+def get_warehouses(
+    session: OrmSession, *, name: str | None = None, skip: int, limit: int
+) -> ListResult[str]:
+    """Get the list of warehouses."""
+    stmt = (
+        select(func.count().over().label("nb_records"), Warehouse.name)
+        .where(
+            # If a client provides an argument i.e it is not None,
+            # we compare the corresponding model field against the argument,
+            # otherwise, we compare the argument to its default which translates
+            # to a SQL true i.e we don't filter based on this argument (a no-op).
+            (
+                Warehouse.name.ilike(f"%{name if name is not None else ''}%")
+                | (name is None)
+            ),
+        )
+        .offset(skip)
+        .limit(limit)
+        .order_by(Warehouse.name.desc())
+    )
+    results = ListResult[str](nb_records=0, records=[])
+
+    for nb_records, warehouse_name in session.execute(stmt).all():
+        results.nb_records = nb_records
+        results.records.append(warehouse_name)
+    return results
diff --git a/backend/src/cms_backend/migrations/versions/1625ae981cfb_make_warehouse_name_unique.py b/backend/src/cms_backend/migrations/versions/1625ae981cfb_make_warehouse_name_unique.py
new file mode 100644
index 0000000..f40de74
--- /dev/null
+++ b/backend/src/cms_backend/migrations/versions/1625ae981cfb_make_warehouse_name_unique.py
@@ -0,0 +1,27 @@
+"""make warehouse name unique
+
+Revision ID: 1625ae981cfb
+Revises: 7c36d46dd0dd
+Create Date: 2026-05-05 14:26:31.772973
+
+"""
+
+from alembic import op
+
+# revision identifiers, used by Alembic.
+revision = "1625ae981cfb"
+down_revision = "7c36d46dd0dd"
+branch_labels = None
+depends_on = None
+
+
+def upgrade():
+    # ### commands auto generated by Alembic - please adjust! ###
+    op.create_index(op.f("ix_warehouse_name"), "warehouse", ["name"], unique=True)
+    # ### end Alembic commands ###
+
+
+def downgrade():
+    # ### commands auto generated by Alembic - please adjust! ###
+    op.drop_index(op.f("ix_warehouse_name"), table_name="warehouse")
+    # ### end Alembic commands ###
diff --git a/backend/src/cms_backend/roles.py b/backend/src/cms_backend/roles.py
index 854f329..75d1aef 100644
--- a/backend/src/cms_backend/roles.py
+++ b/backend/src/cms_backend/roles.py
@@ -31,6 +31,7 @@ class RoleEnum(StrEnum):
         "title": ResourcePermissions.get_all(),
         "zimfarm_notification": ResourcePermissions.get_all(),
         "account": ResourcePermissions.get_all(),
+        "collection": ResourcePermissions.get_all(),
     },
     RoleEnum.ZIMFARM: {
         "zimfarm_notification": ResourcePermissions.get(read=True, create=True),
diff --git a/backend/src/cms_backend/schemas/models.py b/backend/src/cms_backend/schemas/models.py
index f977de1..2f26053 100644
--- a/backend/src/cms_backend/schemas/models.py
+++ b/backend/src/cms_backend/schemas/models.py
@@ -42,3 +42,9 @@ class AccountUpdateSchema(BaseModel):
     username: NotEmptyString | None = None
     idp_sub: NotEmptyString | None = None
     display_name: NotEmptyString | None = None
+
+
+class CollectionUpdateSchema(BaseModel):
+    name: NotEmptyString | None = None
+    download_base_url: AnyUrl | None = None
+    view_base_url: AnyUrl | None = None
diff --git a/backend/src/cms_backend/schemas/orms.py b/backend/src/cms_backend/schemas/orms.py
index 8b8be2c..59627d3 100644
--- a/backend/src/cms_backend/schemas/orms.py
+++ b/backend/src/cms_backend/schemas/orms.py
@@ -44,13 +44,23 @@ class TitleFullSchema(TitleLightSchema):
 
 
 class CollectionLightSchema(BaseModel):
-    """Collection for reading a collection with all the paths in it."""
+    """Schema for reading a collection with all the paths in it."""
 
     id: UUID
     name: str
     paths: list[Path]
 
 
+class CollectionFullSchema(BaseModel):
+    """Schema for reading a collection with all the fileds inlcuding warehouse."""
+
+    id: UUID
+    name: str
+    warehouse: str
+    download_base_url: str | None = None
+    view_base_url: str | None = None
+
+
 class ZimfarmNotificationLightSchema(BaseModel):
     """
     Schema for reading a zimfarm notification model with some fields
diff --git a/backend/tests/api/routes/test_collections.py b/backend/tests/api/routes/test_collections.py
index 0183f2c..f12e27f 100644
--- a/backend/tests/api/routes/test_collections.py
+++ b/backend/tests/api/routes/test_collections.py
@@ -5,7 +5,10 @@
 from fastapi.testclient import TestClient
 from sqlalchemy.orm import Session as OrmSession
 
-from cms_backend.db.models import Collection, Title
+from cms_backend.api.token import generate_access_token
+from cms_backend.db.models import Account, Collection, Title, Warehouse
+from cms_backend.roles import RoleEnum
+from cms_backend.utils.datetime import getnow
 
 
 def test_get_collections_empty(client: TestClient):
@@ -81,3 +84,82 @@ def test_get_collections_pagination(
     assert response_doc["meta"]["limit"] <= limit
     assert response_doc["meta"]["page_size"] == expected_count
     assert "items" in response_doc
+
+
+@pytest.mark.parametrize(
+    "permission,expected_status_code",
+    [
+        pytest.param(RoleEnum.EDITOR, HTTPStatus.OK, id="editor"),
+        pytest.param(RoleEnum.VIEWER, HTTPStatus.UNAUTHORIZED, id="viewer"),
+    ],
+)
+def test_create_collection_required_permissions(
+    client: TestClient,
+    create_account: Callable[..., Account],
+    warehouse: Warehouse,
+    permission: RoleEnum,
+    expected_status_code: HTTPStatus,
+):
+    """Test creating a collection with different roles"""
+    collection_data = {
+        "name": "wikipedia_en_test",
+        "warehouse_name": warehouse.name,
+    }
+
+    account = create_account(permission=permission)
+    access_token = generate_access_token(
+        account_id=str(account.id), issue_time=getnow()
+    )
+    response = client.post(
+        "/v1/collections",
+        json=collection_data,
+        headers={"Authorization": f"Bearer {access_token}"},
+    )
+    assert response.status_code == expected_status_code
+
+
+@pytest.mark.parametrize(
+    "permission,expected_status_code",
+    [
+        pytest.param(RoleEnum.EDITOR, HTTPStatus.OK, id="editor"),
+        pytest.param(RoleEnum.VIEWER, HTTPStatus.UNAUTHORIZED, id="viewer"),
+    ],
+)
+def test_updating_collection_required_permissions(
+    client: TestClient,
+    create_account: Callable[..., Account],
+    collection: Collection,
+    warehouse: Warehouse,
+    permission: RoleEnum,
+    expected_status_code: HTTPStatus,
+):
+    """Test updating a collection with different roles"""
+    collection_data = {
+        "name": collection.name + "update",
+        "warehouse_name": warehouse.name,
+    }
+
+    account = create_account(permission=permission)
+    access_token = generate_access_token(
+        account_id=str(account.id), issue_time=getnow()
+    )
+    response = client.patch(
+        f"/v1/collections/{collection.name}",
+        json=collection_data,
+        headers={"Authorization": f"Bearer {access_token}"},
+    )
+    assert response.status_code == expected_status_code
+
+
+def test_get_collection(
+    client: TestClient,
+    collection: Collection,
+):
+    """Test retrieving a collection"""
+    response = client.get(f"/v1/collections/{collection.name}")
+    assert response.status_code == HTTPStatus.OK
+    data = response.json()
+    assert data["name"] == collection.name
+    assert data["warehouse"] == collection.warehouse.name
+    assert data["download_base_url"] == collection.download_base_url
+    assert data["view_base_url"] == collection.view_base_url
diff --git a/backend/tests/api/routes/test_warehouses.py b/backend/tests/api/routes/test_warehouses.py
new file mode 100644
index 0000000..e59c4b1
--- /dev/null
+++ b/backend/tests/api/routes/test_warehouses.py
@@ -0,0 +1,42 @@
+from collections.abc import Callable
+
+import pytest
+from sqlalchemy.orm import Session as OrmSession
+
+from cms_backend.db.models import Warehouse
+from cms_backend.db.warehouse import get_warehouses
+
+
+def test_get_warehouses_empty(dbsession: OrmSession):
+    """Test that get_warehouses returns empty list when no recipes exist"""
+    result = get_warehouses(dbsession, skip=0, limit=10)
+    assert result.nb_records == 0
+    assert len(result.records) == 0
+
+
+@pytest.mark.parametrize(
+    "skip,limit,expected_count,nb_records",
+    [
+        pytest.param(0, 3, 3, 8, id="first-page"),
+        pytest.param(3, 3, 3, 8, id="second-page"),
+        pytest.param(6, 3, 2, 8, id="third-page-partial"),
+        pytest.param(8, 3, 0, 0, id="page-num-too-high-no-results"),
+        pytest.param(0, 1, 1, 8, id="first-page-with-low-limit"),
+        pytest.param(0, 20, 8, 8, id="first-page-with-high-limit"),
+    ],
+)
+def test_get_tags(
+    dbsession: OrmSession,
+    create_warehouse: Callable[..., Warehouse],
+    skip: int,
+    limit: int,
+    expected_count: int,
+    nb_records: int,
+):
+    for _ in range(8):
+        create_warehouse()
+
+    result = get_warehouses(dbsession, skip=skip, limit=limit)
+    assert result.nb_records == nb_records
+    assert len(result.records) <= limit
+    assert len(result.records) == expected_count
diff --git a/backend/tests/db/test_collections.py b/backend/tests/db/test_collections.py
index d39d4f4..d58543e 100644
--- a/backend/tests/db/test_collections.py
+++ b/backend/tests/db/test_collections.py
@@ -4,12 +4,13 @@
 from sqlalchemy.orm import Session as OrmSession
 
 from cms_backend.db.collection import (
+    create_collection,
     get_collection_by_name,
     get_collection_by_name_or_none,
     get_collections,
 )
 from cms_backend.db.exceptions import RecordDoesNotExistError
-from cms_backend.db.models import Collection, Title
+from cms_backend.db.models import Collection, Title, Warehouse
 
 
 def test_get_collection_by_name_or_none_not_found(
@@ -91,6 +92,20 @@ def test_get_collections_pagination(
         skip=skip,
         limit=limit,
     )
-    assert results.nb_records == 8
     assert len(results.records) <= limit
     assert len(results.records) == expected_count
+
+
+def test_create_collection(dbsession: OrmSession, warehouse: Warehouse):
+    """Test creating a collection."""
+    collection = create_collection(
+        dbsession,
+        name="testcollection",
+        download_base_url="https://www.example.com",
+        view_base_url="https://www.example.com",
+        warehouse_name=warehouse.name,
+    )
+    assert collection.name == "testcollection"
+    assert collection.download_base_url == "https://www.example.com"
+    assert collection.view_base_url == "https://www.example.com"
+    assert collection.warehouse.name == warehouse.name
diff --git a/backend/tests/db/test_warehouse.py b/backend/tests/db/test_warehouse.py
new file mode 100644
index 0000000..e69de29
diff --git a/frontend/src/App.vue b/frontend/src/App.vue
index 4d72b1d..cd27894 100644
--- a/frontend/src/App.vue
+++ b/frontend/src/App.vue
@@ -25,6 +25,7 @@ onMounted(async () => {
 const canReadUsers = computed(() => {
   return authStore.hasPermission('account', 'read')
 })
+
 const navigationItems = computed<NavigationItem[]>(() => [
   {
     name: 'inbox',
@@ -42,6 +43,14 @@ const navigationItems = computed<NavigationItem[]>(() => [
     disabled: false,
     show: true,
   },
+  {
+    name: 'collections',
+    label: 'Collections',
+    route: 'collections',
+    icon: 'mdi-folder-multiple',
+    disabled: false,
+    show: true,
+  },
   {
     name: 'users-list',
     label: 'Users',
diff --git a/frontend/src/components/CollectionFormDialog.vue b/frontend/src/components/CollectionFormDialog.vue
new file mode 100644
index 0000000..2c5999a
--- /dev/null
+++ b/frontend/src/components/CollectionFormDialog.vue
@@ -0,0 +1,257 @@
+<template>
+  <v-dialog v-model="isOpen" max-width="600px" persistent>
+    <v-card>
+      <v-card-title class="text-h5 pa-4 bg-primary">
+        <span class="text-white">{{
+          isEditMode ? 'Edit Collection' : 'Create New Collection'
+        }}</span>
+      </v-card-title>
+
+      <v-card-text class="pt-4">
+        <v-form ref="formRef" v-model="formValid">
+          <v-text-field
+            v-model="formData.name"
+            label="Collection Name"
+            :rules="[rules.required]"
+            variant="outlined"
+            density="comfortable"
+            class="mb-2"
+          />
+
+          <v-text-field
+            v-if="!isEditMode"
+            v-model="formData.warehouse_name"
+            label="Warehouse Name"
+            :rules="[rules.required]"
+            variant="outlined"
+            density="comfortable"
+            class="mb-2"
+          />
+
+          <v-text-field
+            v-if="isEditMode"
+            :model-value="collection?.warehouse"
+            label="Warehouse"
+            variant="outlined"
+            density="comfortable"
+            class="mb-2"
+            readonly
+            disabled
+          />
+
+          <v-text-field
+            v-model="formData.download_base_url"
+            label="Download Base URL (Optional)"
+            variant="outlined"
+            density="comfortable"
+            class="mb-2"
+            placeholder="https://example.com/download"
+          />
+
+          <v-text-field
+            v-model="formData.view_base_url"
+            label="View Base URL (Optional)"
+            variant="outlined"
+            density="comfortable"
+            placeholder="https://example.com/view"
+          />
+        </v-form>
+
+        <v-alert v-if="error" type="error" class="mt-4" density="compact">
+          {{ error }}
+        </v-alert>
+      </v-card-text>
+
+      <v-card-actions class="pa-4">
+        <v-spacer />
+        <v-btn variant="text" @click="handleCancel" :disabled="loading">Cancel</v-btn>
+        <v-btn
+          color="primary"
+          variant="elevated"
+          @click="handleSubmit"
+          :loading="loading"
+          :disabled="!formValid || loading || (isEditMode && !hasChanges)"
+        >
+          {{ isEditMode ? 'Save Changes' : 'Create Collection' }}
+        </v-btn>
+      </v-card-actions>
+    </v-card>
+  </v-dialog>
+</template>
+
+<script setup lang="ts">
+import { useCollectionsStore } from '@/stores/collections'
+import type { Collection, CollectionUpdate } from '@/types/collections'
+import { computed, ref, watch } from 'vue'
+
+interface Props {
+  modelValue: boolean
+  collection?: Collection | null
+}
+
+const props = withDefaults(defineProps<Props>(), {
+  collection: null,
+})
+
+const emit = defineEmits<{
+  'update:modelValue': [value: boolean]
+  created: []
+  updated: [updatedCollection: { id: string; name: string }]
+}>()
+
+const collectionsStore = useCollectionsStore()
+
+const formRef = ref()
+const formValid = ref(false)
+const loading = ref(false)
+const error = ref('')
+
+interface FormData {
+  name: string
+  warehouse_name?: string
+  download_base_url?: string
+  view_base_url?: string
+}
+
+const formData = ref<FormData>({
+  name: '',
+  warehouse_name: '',
+  download_base_url: '',
+  view_base_url: '',
+})
+
+const isEditMode = computed(() => props.collection !== null)
+
+const isOpen = computed({
+  get: () => props.modelValue,
+  set: (value) => emit('update:modelValue', value),
+})
+
+const hasChanges = computed(() => {
+  if (!isEditMode.value || !props.collection) return true
+
+  const nameChanged = formData.value.name !== props.collection.name
+  const downloadUrlChanged =
+    (formData.value.download_base_url || '') !== (props.collection.download_base_url || '')
+  const viewUrlChanged =
+    (formData.value.view_base_url || '') !== (props.collection.view_base_url || '')
+
+  return nameChanged || downloadUrlChanged || viewUrlChanged
+})
+
+const rules = {
+  required: (value: string) => !!value || 'This field is required',
+}
+
+watch(
+  () => props.collection,
+  (newCollection) => {
+    if (newCollection) {
+      resetFormToCollection(newCollection)
+    }
+  },
+  { immediate: true },
+)
+
+watch(isOpen, (newValue) => {
+  if (newValue) {
+    if (props.collection) {
+      resetFormToCollection(props.collection)
+    } else {
+      resetForm()
+    }
+  }
+})
+
+function resetFormToCollection(collection: Collection) {
+  formData.value = {
+    name: collection.name,
+    warehouse_name: collection.warehouse,
+    download_base_url: collection.download_base_url || '',
+    view_base_url: collection.view_base_url || '',
+  }
+  error.value = ''
+  formRef.value?.resetValidation()
+}
+
+async function handleSubmit() {
+  if (!formValid.value) return
+
+  loading.value = true
+  error.value = ''
+
+  try {
+    if (isEditMode.value && props.collection) {
+      const updatePayload: Partial<CollectionUpdate> = {}
+
+      if (formData.value.name !== props.collection.name) {
+        updatePayload.name = formData.value.name
+      }
+
+      const currentDownloadUrl = formData.value.download_base_url || ''
+      const originalDownloadUrl = props.collection.download_base_url || ''
+      if (currentDownloadUrl !== originalDownloadUrl) {
+        updatePayload.download_base_url = currentDownloadUrl || null
+      }
+
+      const currentViewUrl = formData.value.view_base_url || ''
+      const originalViewUrl = props.collection.view_base_url || ''
+      if (currentViewUrl !== originalViewUrl) {
+        updatePayload.view_base_url = currentViewUrl || null
+      }
+
+      const response = await collectionsStore.updateCollection(props.collection.id, updatePayload)
+      if (response) {
+        emit('updated', { id: response.id, name: response.name })
+        resetForm()
+        isOpen.value = false
+      } else {
+        error.value = collectionsStore.errors.join(', ') || 'Failed to update collection'
+      }
+    } else {
+      // Create mode
+      const createPayload = {
+        name: formData.value.name,
+        warehouse_name: formData.value.warehouse_name!,
+        download_base_url: formData.value.download_base_url || undefined,
+        view_base_url: formData.value.view_base_url || undefined,
+      }
+      const response = await collectionsStore.createCollection(createPayload)
+      if (response) {
+        emit('created')
+        resetForm()
+        isOpen.value = false
+      } else {
+        error.value = collectionsStore.errors.join(', ') || 'Failed to create collection'
+      }
+    }
+  } catch (err) {
+    console.error(`Failed to ${isEditMode.value ? 'update' : 'create'} collection`, err)
+    error.value =
+      collectionsStore.errors.join(', ') ||
+      `Failed to ${isEditMode.value ? 'update' : 'create'} collection`
+  } finally {
+    loading.value = false
+  }
+}
+
+function handleCancel() {
+  resetForm()
+  isOpen.value = false
+}
+
+function resetForm() {
+  if (isEditMode.value && props.collection) {
+    resetFormToCollection(props.collection)
+  } else {
+    formData.value = {
+      name: '',
+      warehouse_name: '',
+      download_base_url: '',
+      view_base_url: '',
+    }
+    error.value = ''
+    formRef.value?.resetValidation()
+  }
+}
+</script>
diff --git a/frontend/src/components/CollectionsTable.vue b/frontend/src/components/CollectionsTable.vue
new file mode 100644
index 0000000..2bf0e46
--- /dev/null
+++ b/frontend/src/components/CollectionsTable.vue
@@ -0,0 +1,108 @@
+<template>
+  <div>
+    <v-card v-if="!errors.length" :class="{ loading: loading }" flat>
+      <v-data-table-server
+        :headers="headers"
+        :items="collections"
+        :loading="loading"
+        :page="paginator.page"
+        :items-per-page="paginator.limit"
+        :items-length="paginator.count"
+        :items-per-page-options="limits"
+        class="elevation-1 cursor-pointer-table"
+        item-key="id"
+        hover
+        @update:options="onUpdateOptions"
+        @click:row="onRowClick"
+        :hide-default-footer="props.paginator.count === 0"
+        :hide-default-header="props.paginator.count === 0"
+        :mobile="smAndDown"
+        :density="smAndDown ? 'compact' : 'comfortable'"
+      >
+        <template #loading>
+          <div class="d-flex flex-column align-center justify-center pa-8">
+            <v-progress-circular indeterminate size="64" />
+            <div class="mt-4 text-body-1">{{ loadingText || 'Fetching collections...' }}</div>
+          </div>
+        </template>
+
+        <template #[`item.name`]="{ item }">
+          <span class="font-weight-medium">{{ item.name }}</span>
+        </template>
+
+        <template #[`item.paths`]="{ item }">
+          <v-chip
+            v-for="path in item.paths"
+            :key="path"
+            size="small"
+            class="mr-1 mt-1 mb-1"
+            variant="tonal"
+            color="primary"
+          >
+            {{ path }}
+          </v-chip>
+        </template>
+
+        <template #no-data>
+          <div class="text-center pa-4">
+            <v-icon size="large" class="mb-2">mdi-folder-multiple-outline</v-icon>
+            <div class="text-body-1">No collections found</div>
+          </div>
+        </template>
+      </v-data-table-server>
+      <ErrorMessage v-for="error in errors" :key="error" :message="error" />
+    </v-card>
+  </div>
+</template>
+
+<script setup lang="ts">
+import ErrorMessage from '@/components/ErrorMessage.vue'
+import type { Paginator } from '@/types/base'
+import type { CollectionLight } from '@/types/collections'
+import { useRoute, useRouter } from 'vue-router'
+import { useDisplay } from 'vuetify'
+
+const props = defineProps<{
+  headers: { title: string; key: string; sortable?: boolean }[]
+  collections: CollectionLight[]
+  paginator: Paginator
+  loading: boolean
+  errors: string[]
+  loadingText: string
+}>()
+
+const emit = defineEmits<{
+  limitChanged: [limit: number]
+}>()
+
+const limits = [10, 20, 50, 100]
+const router = useRouter()
+const route = useRoute()
+const { smAndDown } = useDisplay()
+
+function onUpdateOptions(options: { page: number; itemsPerPage: number }) {
+  const query = { ...route.query }
+
+  if (options.page > 1) {
+    query.page = options.page.toString()
+  } else {
+    delete query.page
+  }
+
+  router.push({ query })
+
+  if (options.itemsPerPage != props.paginator.limit) {
+    emit('limitChanged', options.itemsPerPage)
+  }
+}
+
+function onRowClick(event: Event, { item }: { item: CollectionLight }) {
+  router.push({ name: 'collection-detail', params: { id: item.name } })
+}
+</script>
+
+<style scoped>
+:deep(.cursor-pointer-table tbody tr) {
+  cursor: pointer;
+}
+</style>
diff --git a/frontend/src/components/EditCollectionDialog.vue b/frontend/src/components/EditCollectionDialog.vue
new file mode 100644
index 0000000..a7d3774
--- /dev/null
+++ b/frontend/src/components/EditCollectionDialog.vue
@@ -0,0 +1,30 @@
+<template>
+  <CollectionFormDialog v-model="isOpen" :collection="collection" @updated="handleUpdated" />
+</template>
+
+<script setup lang="ts">
+import CollectionFormDialog from '@/components/CollectionFormDialog.vue'
+import type { Collection } from '@/types/collections'
+import { computed } from 'vue'
+
+interface Props {
+  modelValue: boolean
+  collection: Collection | null
+}
+
+const props = defineProps<Props>()
+
+const emit = defineEmits<{
+  'update:modelValue': [value: boolean]
+  updated: [updatedCollection: { id: string; name: string }]
+}>()
+
+const isOpen = computed({
+  get: () => props.modelValue,
+  set: (value) => emit('update:modelValue', value),
+})
+
+function handleUpdated(updatedCollection: { id: string; name: string }) {
+  emit('updated', updatedCollection)
+}
+</script>
diff --git a/frontend/src/components/EventsList.vue b/frontend/src/components/EventsList.vue
index 19d6772..b20cd8e 100644
--- a/frontend/src/components/EventsList.vue
+++ b/frontend/src/components/EventsList.vue
@@ -8,15 +8,10 @@
     <v-list
       lines="one"
       density="compact"
-      class="overflow-y-auto events-list-container"
+      class="overflow-y-auto events-list-container striped-list"
       style="max-height: 400px"
     >
-      <v-list-item
-        v-for="(event, index) in parsedEvents"
-        :key="index"
-        :class="index % 2 === 0 ? 'bg-grey-lighten-4' : ''"
-        class="px-3 py-1"
-      >
+      <v-list-item v-for="(event, index) in parsedEvents" :key="index" class="px-3 py-1">
         <v-list-item-title class="text-body-2 text-wrap">
           {{ event.timestamp }}: {{ event.message }}
         </v-list-item-title>
@@ -89,3 +84,9 @@ const copyToClipboard = async (text: string) => {
   }
 }
 </script>
+
+<style scoped>
+.striped-list :deep(.v-list-item:nth-child(even)) {
+  background-color: rgba(var(--v-theme-on-surface), 0.05);
+}
+</style>
diff --git a/frontend/src/components/TitlesFilters.vue b/frontend/src/components/TitlesFilters.vue
index ccb0321..a5afebe 100644
--- a/frontend/src/components/TitlesFilters.vue
+++ b/frontend/src/components/TitlesFilters.vue
@@ -13,6 +13,17 @@
             @change="emitFilters"
           />
         </v-col>
+        <v-col cols="12" sm="6" md="3">
+          <v-text-field
+            v-model="localFilters.collection_name"
+            label="Collection Name"
+            placeholder="Search by collection name..."
+            variant="outlined"
+            density="compact"
+            hide-details
+            @change="emitFilters"
+          />
+        </v-col>
       </v-row>
     </v-card-text>
   </v-card>
@@ -25,6 +36,7 @@ import { ref, watch } from 'vue'
 interface Props {
   filters: {
     name: string
+    collection_name: string
   }
 }
 
@@ -35,6 +47,7 @@ const emit = defineEmits<{
   filtersChanged: [
     filters: {
       name: string
+      collection_name: string
     },
   ]
 }>()
@@ -42,6 +55,7 @@ const emit = defineEmits<{
 // Local filters state
 const localFilters = ref({
   name: props.filters.name,
+  collection_name: props.filters.collection_name,
 })
 
 // Watch for prop changes and update local state
@@ -50,6 +64,7 @@ watch(
   (newFilters) => {
     localFilters.value = {
       name: newFilters.name,
+      collection_name: newFilters.collection_name,
     }
   },
   { deep: true },
@@ -59,6 +74,7 @@ watch(
 function emitFilters() {
   emit('filtersChanged', {
     name: localFilters.value.name,
+    collection_name: localFilters.value.collection_name,
   })
 }
 </script>
diff --git a/frontend/src/components/TitlesTable.vue b/frontend/src/components/TitlesTable.vue
index 7ab59bd..9d836f3 100644
--- a/frontend/src/components/TitlesTable.vue
+++ b/frontend/src/components/TitlesTable.vue
@@ -36,12 +36,14 @@
         :items-per-page="selectedLimit"
         :items-length="paginator.count"
         :items-per-page-options="limits"
-        class="elevation-1"
+        class="elevation-1 cursor-pointer-table"
         item-value="name"
         :show-select="showSelection"
         :model-value="selectedTitles"
+        hover
         @update:model-value="handleSelectionChange"
         @update:options="onUpdateOptions"
+        @click:row="onRowClick"
         :hide-default-footer="props.paginator.count === 0"
         :hide-default-header="props.paginator.count === 0"
       >
@@ -53,11 +55,9 @@
         </template>
 
         <template #[`item.name`]="{ item }">
-          <router-link :to="{ name: 'title-detail', params: { id: item.name } }">
-            <span class="d-flex align-center">
-              {{ item.name }}
-            </span>
-          </router-link>
+          <span class="d-flex align-center">
+            {{ item.name }}
+          </span>
         </template>
 
         <template #no-data>
@@ -75,6 +75,7 @@
 import type { Paginator } from '@/types/base'
 import type { TitleLight } from '@/types/title'
 import { computed, ref, watch } from 'vue'
+import { useRouter } from 'vue-router'
 
 // Props
 interface Props {
@@ -107,6 +108,7 @@ const emit = defineEmits<{
   selectionChanged: [selectedTitles: string[]]
 }>()
 
+const router = useRouter()
 const limits = [10, 20, 50, 100]
 const selectedLimit = ref(props.paginator.limit)
 
@@ -142,4 +144,19 @@ function clearSelections() {
 function handleClearFilters() {
   emit('clearFilters')
 }
+
+function onRowClick(event: Event, { item }: { item: TitleLight }) {
+  // Don't navigate if clicking on checkbox column
+  const target = event.target as HTMLElement
+  if (target.closest('.v-selection-control') || target.closest('td.v-data-table__td--select')) {
+    return
+  }
+  router.push({ name: 'title-detail', params: { id: item.name } })
+}
 </script>
+
+<style scoped>
+:deep(.cursor-pointer-table tbody tr) {
+  cursor: pointer;
+}
+</style>
diff --git a/frontend/src/components/UsersTable.vue b/frontend/src/components/UsersTable.vue
index 7b8e59f..93db2fd 100644
--- a/frontend/src/components/UsersTable.vue
+++ b/frontend/src/components/UsersTable.vue
@@ -21,9 +21,11 @@
         :items-per-page="paginator.limit"
         :items-length="paginator.count"
         :items-per-page-options="limits"
-        class="elevation-1"
+        class="elevation-1 cursor-pointer-table"
         item-key="id"
+        hover
         @update:options="onUpdateOptions"
+        @click:row="onRowClick"
         :hide-default-footer="props.paginator.count === 0"
         :hide-default-header="props.paginator.count === 0"
         :mobile="smAndDown"
@@ -37,12 +39,9 @@
         </template>
 
         <template #[`item.display_name`]="{ item }">
-          <router-link
-            :to="{ name: 'user-detail', params: { userId: item.id } }"
-            class="text-decoration-none text-primary"
-          >
+          <span class="text-primary font-weight-medium">
             {{ item.display_name }}
-          </router-link>
+          </span>
         </template>
 
         <template #[`item.role`]="{ item }">
@@ -114,4 +113,14 @@ const getRoleColor = (role: string): string => {
   }
   return colorMap[role] || 'default'
 }
+
+function onRowClick(event: Event, { item }: { item: User }) {
+  router.push({ name: 'user-detail', params: { userId: item.id } })
+}
 </script>
+
+<style scoped>
+:deep(.cursor-pointer-table tbody tr) {
+  cursor: pointer;
+}
+</style>
diff --git a/frontend/src/router/index.ts b/frontend/src/router/index.ts
index 92833f6..8cb0eea 100644
--- a/frontend/src/router/index.ts
+++ b/frontend/src/router/index.ts
@@ -5,6 +5,8 @@ import SignInView from '@/views/SignInView.vue'
 import OAuthCallbackView from '@/views/OAuthCallbackView.vue'
 import UsersView from '@/views/UsersView.vue'
 import UserView from '@/views/UserView.vue'
+import CollectionsView from '@/views/CollectionsView.vue'
+import CollectionView from '@/views/CollectionView.vue'
 import { createRouter, createWebHistory, type RouteLocationNormalized } from 'vue-router'
 import TitlesView from '@/views/TitlesView.vue'
 import TitleView from '@/views/TitleView.vue'
@@ -98,6 +100,21 @@ const routes = [
     component: UsersView,
     meta: { title: 'Zimfarm | Users' },
   },
+  {
+    path: '/collections',
+    name: 'collections',
+    component: CollectionsView,
+    meta: { title: 'CMS | Collections' },
+  },
+  {
+    path: '/collection/:id',
+    name: 'collection-detail',
+    component: CollectionView,
+    props: true,
+    meta: {
+      title: (to: RouteLocationNormalized) => `CMS | Collection • ${to.params.id}`,
+    },
+  },
   {
     path: '/:pathMatch(.*)*',
     name: '404',
diff --git a/frontend/src/stores/collections.ts b/frontend/src/stores/collections.ts
index 5e00b42..fbb758f 100644
--- a/frontend/src/stores/collections.ts
+++ b/frontend/src/stores/collections.ts
@@ -1,6 +1,6 @@
 import { useAuthStore } from '@/stores/auth'
 import type { ListResponse, Paginator } from '@/types/base'
-import type { CollectionLight } from '@/types/collections'
+import type { CollectionLight, Collection, CollectionUpdate } from '@/types/collections'
 import type { ErrorResponse } from '@/types/errors'
 import { translateErrors } from '@/utils/errors'
 import { defineStore } from 'pinia'
@@ -19,23 +19,97 @@ export const useCollectionsStore = defineStore('collection', () => {
   })
   const authStore = useAuthStore()
 
-  const fetchCollections = async (limit: number = 20, skip: number = 0) => {
+  const fetchCollections = async (limit: number = 20, skip: number = 0, name?: string) => {
     const service = await authStore.getApiService('collections')
+    // filter out undefined/falsy string values
+    const cleanedParams = Object.fromEntries(
+      Object.entries({
+        limit,
+        skip,
+        name,
+      }).filter(([, value]) => !!value || value === 0),
+    )
     try {
       const response = await service.get<null, ListResponse<CollectionLight>>('', {
-        params: { skip, limit },
+        params: cleanedParams,
       })
+      errors.value = []
       collections.value = response.items
       paginator.value = response.meta
-      errors.value = []
       return collections.value
     } catch (_error) {
       console.error('Failed to fetch collections', _error)
       errors.value = translateErrors(_error as ErrorResponse)
+      collections.value = []
+      paginator.value = {
+        page: 1,
+        page_size: defaultLimit.value,
+        skip: 0,
+        limit: defaultLimit.value,
+        count: 0,
+      }
+      return null
+    }
+  }
+
+  const fetchCollection = async (name: string) => {
+    const service = await authStore.getApiService('collections')
+    try {
+      const response = await service.get<null, Collection>(`/${name}`)
+      errors.value = []
+      return response
+    } catch (_error) {
+      console.error('Failed to fetch collection', _error)
+      errors.value = translateErrors(_error as ErrorResponse)
+      return null
+    }
+  }
+
+  const createCollection = async (payload: {
+    name: string
+    warehouse_name: string
+    download_base_url?: string
+    view_base_url?: string
+  }) => {
+    const service = await authStore.getApiService('collections')
+    try {
+      const response = await service.post<
+        {
+          name: string
+          warehouse_name: string
+          download_base_url?: string
+          view_base_url?: string
+        },
+        Collection
+      >('', payload)
+      errors.value = []
+      return response
+    } catch (error) {
+      console.error('Failed to create collection', error)
+      errors.value = translateErrors(error as ErrorResponse)
       return null
     }
   }
 
+  const updateCollection = async (
+    collectionId: string,
+    collectionData: Partial<CollectionUpdate>,
+  ) => {
+    const service = await authStore.getApiService('collections')
+    try {
+      errors.value = []
+      const response = await service.patch<CollectionUpdate, Collection>(
+        `/${collectionId}`,
+        collectionData,
+      )
+      return response
+    } catch (_error) {
+      console.error('Failed to update collection', _error)
+      errors.value = translateErrors(_error as ErrorResponse)
+      throw _error
+    }
+  }
+
   const savePaginatorLimit = (limit: number) => {
     localStorage.setItem('colle-table-limit', limit.toString())
   }
@@ -48,6 +122,9 @@ export const useCollectionsStore = defineStore('collection', () => {
     errors,
     // Actions
     fetchCollections,
+    fetchCollection,
+    updateCollection,
+    createCollection,
     savePaginatorLimit,
   }
 })
diff --git a/frontend/src/stores/title.ts b/frontend/src/stores/title.ts
index b72efb6..00caf10 100644
--- a/frontend/src/stores/title.ts
+++ b/frontend/src/stores/title.ts
@@ -44,7 +44,12 @@ export const useTitleStore = defineStore('title', () => {
     return title.value
   }
 
-  const fetchTitles = async (limit: number, skip: number, name: string | undefined) => {
+  const fetchTitles = async (
+    limit: number,
+    skip: number,
+    name: string | undefined,
+    collection_name: string | undefined,
+  ) => {
     const service = await authStore.getApiService('titles')
     // filter out undefined values from params
     const cleanedParams = Object.fromEntries(
@@ -52,6 +57,7 @@ export const useTitleStore = defineStore('title', () => {
         limit,
         skip,
         name,
+        collection_name,
       }).filter(([, value]) => !!value),
     )
     try {
diff --git a/frontend/src/stores/warehouse.ts b/frontend/src/stores/warehouse.ts
new file mode 100644
index 0000000..b7eaf34
--- /dev/null
+++ b/frontend/src/stores/warehouse.ts
@@ -0,0 +1,30 @@
+import { useAuthStore } from '@/stores/auth'
+import type { ListResponse } from '@/types/base'
+import { defineStore } from 'pinia'
+import { ref } from 'vue'
+
+export const useWarehouseStore = defineStore('warehouse', () => {
+  const warehouses = ref<string[]>([])
+  const error = ref<Error | null>(null)
+
+  const authStore = useAuthStore()
+
+  const fetchWarehouses = async (limit: number = 100) => {
+    try {
+      const service = await authStore.getApiService('warehouses')
+      const response = await service.get<null, ListResponse<string>>('', { params: { limit } })
+      warehouses.value = response.items
+      return warehouses.value
+    } catch (_error) {
+      console.error('Failed to fetch warehouses', _error)
+      error.value = _error as Error
+      return null
+    }
+  }
+
+  return {
+    warehouses,
+    error,
+    fetchWarehouses,
+  }
+})
diff --git a/frontend/src/types/collections.ts b/frontend/src/types/collections.ts
index f6ae85c..93f805b 100644
--- a/frontend/src/types/collections.ts
+++ b/frontend/src/types/collections.ts
@@ -3,3 +3,17 @@ export interface CollectionLight {
   name: string
   paths: string[]
 }
+
+export interface Collection {
+  id: string
+  name: string
+  warehouse: string
+  download_base_url?: string
+  view_base_url?: string
+}
+
+export interface CollectionUpdate {
+  name?: string
+  download_base_url?: string | null
+  view_base_url?: string | null
+}
diff --git a/frontend/src/views/CollectionView.vue b/frontend/src/views/CollectionView.vue
new file mode 100644
index 0000000..ff096bd
--- /dev/null
+++ b/frontend/src/views/CollectionView.vue
@@ -0,0 +1,158 @@
+<template>
+  <v-container>
+    <div v-if="!dataLoaded && loadingStore.isLoading" class="text-center pa-8">
+      <v-progress-circular indeterminate size="64" />
+      <div class="mt-4 text-body-1">{{ loadingStore.loadingText }}</div>
+    </div>
+
+    <div v-if="dataLoaded && collection">
+      <div class="d-flex justify-end mb-4" v-if="canEditCollection">
+        <v-btn color="primary" prepend-icon="mdi-pencil" @click="openEditDialog">
+          Edit Collection
+        </v-btn>
+      </div>
+      <div>
+        <v-row no-gutters class="py-2">
+          <v-col cols="12" md="3">
+            <div class="text-subtitle-2">Id</div>
+          </v-col>
+          <v-col cols="12" md="9">
+            <code>{{ collection.id }}</code>
+          </v-col>
+        </v-row>
+        <v-divider class="my-2"></v-divider>
+
+        <v-row no-gutters class="py-2">
+          <v-col cols="12" md="3">
+            <div class="text-subtitle-2">Name</div>
+          </v-col>
+          <v-col cols="12" md="9">
+            {{ collection.name }}
+          </v-col>
+        </v-row>
+        <v-divider class="my-2"></v-divider>
+
+        <v-row no-gutters class="py-2">
+          <v-col cols="12" md="3">
+            <div class="text-subtitle-2">Warehouse</div>
+          </v-col>
+          <v-col cols="12" md="9">
+            {{ collection.warehouse }}
+          </v-col>
+        </v-row>
+        <v-divider class="my-2"></v-divider>
+
+        <v-row no-gutters class="py-2">
+          <v-col cols="12" md="3">
+            <div class="text-subtitle-2">Download Base URL</div>
+          </v-col>
+          <v-col cols="12" md="9">
+            <span v-if="collection.download_base_url">{{ collection.download_base_url }}</span>
+            <span v-else class="text-grey">Not set</span>
+          </v-col>
+        </v-row>
+        <v-divider class="my-2"></v-divider>
+
+        <v-row no-gutters class="py-2">
+          <v-col cols="12" md="3">
+            <div class="text-subtitle-2">View Base URL</div>
+          </v-col>
+          <v-col cols="12" md="9">
+            <span v-if="collection.view_base_url">{{ collection.view_base_url }}</span>
+            <span v-else class="text-grey">Not set</span>
+          </v-col>
+        </v-row>
+        <v-divider class="my-2"></v-divider>
+
+        <v-row no-gutters class="py-2">
+          <v-col cols="12" md="3">
+            <div class="text-subtitle-2">Titles</div>
+          </v-col>
+          <v-col cols="12" md="9">
+            <router-link
+              :to="{ name: 'titles', query: { collection_name: collection.name } }"
+              class="text-decoration-none text-primary font-weight-medium"
+            >
+              View Titles
+            </router-link>
+          </v-col>
+        </v-row>
+      </div>
+    </div>
+
+    <EditCollectionDialog
+      v-model="editDialogOpen"
+      :collection="collection"
+      @updated="handleCollectionUpdated"
+    />
+  </v-container>
+</template>
+
+<script setup lang="ts">
+import EditCollectionDialog from '@/components/EditCollectionDialog.vue'
+import { useLoadingStore } from '@/stores/loading'
+import { useNotificationStore } from '@/stores/notification'
+import { useCollectionsStore } from '@/stores/collections'
+import { useAuthStore } from '@/stores/auth'
+import type { Collection } from '@/types/collections'
+import { computed, onMounted, ref } from 'vue'
+import { useRouter } from 'vue-router'
+
+const router = useRouter()
+
+const loadingStore = useLoadingStore()
+const collectionStore = useCollectionsStore()
+const notificationStore = useNotificationStore()
+const authStore = useAuthStore()
+
+const error = ref<string | null>(null)
+const collection = ref<Collection | null>(null)
+const dataLoaded = ref(false)
+const editDialogOpen = ref(false)
+
+const canEditCollection = computed(() => authStore.hasPermission('collection', 'update'))
+
+interface Props {
+  id: string
+}
+
+const props = defineProps<Props>()
+
+const loadData = async () => {
+  loadingStore.startLoading('Fetching collection...')
+
+  const data = await collectionStore.fetchCollection(props.id)
+  if (data) {
+    error.value = null
+    collection.value = data
+    dataLoaded.value = true
+  } else {
+    error.value = 'Failed to load collection'
+    for (const err of collectionStore.errors) {
+      notificationStore.showError(err)
+    }
+  }
+
+  if (loadingStore.isLoading) {
+    loadingStore.stopLoading()
+  }
+}
+
+onMounted(async () => {
+  await loadData()
+})
+
+const openEditDialog = () => {
+  editDialogOpen.value = true
+}
+
+const handleCollectionUpdated = async (updatedCollection: { id: string; name: string }) => {
+  notificationStore.showSuccess('Collection updated successfully!')
+
+  // If the name changed, navigate to the new URL
+  if (updatedCollection.name !== props.id) {
+    await router.push({ name: 'collection-detail', params: { id: updatedCollection.name } })
+  }
+  await loadData()
+}
+</script>
diff --git a/frontend/src/views/CollectionsView.vue b/frontend/src/views/CollectionsView.vue
new file mode 100644
index 0000000..3aa4a1f
--- /dev/null
+++ b/frontend/src/views/CollectionsView.vue
@@ -0,0 +1,354 @@
+<template>
+  <div>
+    <v-card class="mb-4" flat>
+      <v-card-text>
+        <v-row align="center">
+          <v-col cols="12" sm="8">
+            <v-text-field
+              v-model="searchCollection"
+              label="Search collection"
+              placeholder="Enter collection name to search"
+              variant="outlined"
+              density="compact"
+              prepend-inner-icon="mdi-magnify"
+              clearable
+              hide-details
+              @blur="handleSearchChange"
+              @keyup.enter="handleSearchChange"
+              @click:clear="handleSearchChange"
+            />
+          </v-col>
+          <v-col cols="12" sm="4">
+            <v-btn
+              v-if="canCreateCollections"
+              color="primary"
+              variant="elevated"
+              block
+              @click="showCreateDialog = true"
+            >
+              <v-icon class="mr-2">mdi-plus</v-icon>
+              Create Collection
+            </v-btn>
+          </v-col>
+        </v-row>
+      </v-card-text>
+    </v-card>
+
+    <CollectionsTable
+      :headers="headers"
+      :collections="collections"
+      :paginator="paginator"
+      :loading="loadingStore.isLoading"
+      :loading-text="loadingStore.loadingText"
+      :errors="collectionStore.errors"
+      @limit-changed="handleLimitChange"
+    />
+
+    <!-- Create Collection Dialog -->
+    <v-dialog v-model="showCreateDialog" max-width="600" persistent>
+      <v-card>
+        <v-card-title class="text-h6 bg-primary">
+          <v-icon class="mr-2">mdi-folder-plus</v-icon>
+          Create New Collection
+        </v-card-title>
+
+        <v-card-text class="pt-4">
+          <v-form @submit.prevent="createCollection" ref="formRef">
+            <v-row>
+              <v-col cols="12">
+                <v-text-field
+                  v-model="form.name"
+                  label="Collection Name"
+                  placeholder="Enter collection name"
+                  variant="outlined"
+                  density="compact"
+                  hide-details="auto"
+                  :validate-on="'blur'"
+                  :rules="[rules.required, rules.minLength(3)]"
+                />
+              </v-col>
+
+              <v-col cols="12">
+                <v-select
+                  v-model="form.warehouse_name"
+                  :items="warehouseStore.warehouses"
+                  label="Warehouse Name"
+                  variant="outlined"
+                  density="compact"
+                  hide-details="auto"
+                  :validate-on="'blur'"
+                  :rules="[rules.required, rules.minLength(3)]"
+                />
+              </v-col>
+
+              <v-col cols="12">
+                <v-text-field
+                  v-model="form.download_base_url"
+                  label="Download Base URL"
+                  placeholder="https://example.com/download"
+                  variant="outlined"
+                  density="compact"
+                  hide-details="auto"
+                  :validate-on="'blur'"
+                  :rules="[rules.validUrl]"
+                />
+              </v-col>
+
+              <v-col cols="12">
+                <v-text-field
+                  v-model="form.view_base_url"
+                  label="View Base URL"
+                  placeholder="https://example.com/view"
+                  variant="outlined"
+                  density="compact"
+                  hide-details="auto"
+                  :validate-on="'blur'"
+                  :rules="[rules.validUrl]"
+                />
+              </v-col>
+            </v-row>
+          </v-form>
+        </v-card-text>
+
+        <v-card-actions>
+          <v-spacer />
+          <v-btn variant="text" @click="closeCreateDialog" :disabled="isCreating"> Cancel </v-btn>
+          <v-btn
+            color="primary"
+            variant="elevated"
+            :disabled="!isFormValid || isCreating"
+            :loading="isCreating"
+            @click="createCollection"
+          >
+            <v-icon class="mr-2">mdi-plus</v-icon>
+            Create Collection
+          </v-btn>
+        </v-card-actions>
+      </v-card>
+    </v-dialog>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { computed, onMounted, ref, watch } from 'vue'
+import { useRouter, useRoute } from 'vue-router'
+
+import CollectionsTable from '@/components/CollectionsTable.vue'
+import { useAuthStore } from '@/stores/auth'
+import { useLoadingStore } from '@/stores/loading'
+import { useNotificationStore } from '@/stores/notification'
+import { useCollectionsStore } from '@/stores/collections'
+import { useWarehouseStore } from '@/stores/warehouse'
+import type { CollectionLight } from '@/types/collections'
+
+// Router and stores
+const router = useRouter()
+const route = useRoute()
+const authStore = useAuthStore()
+const loadingStore = useLoadingStore()
+const notificationStore = useNotificationStore()
+const collectionStore = useCollectionsStore()
+const warehouseStore = useWarehouseStore()
+
+// Form ref
+const formRef = ref()
+
+// Reactive data
+const collections = ref<CollectionLight[]>([])
+const searchCollection = ref<string>('')
+const showCreateDialog = ref(false)
+const isCreating = ref(false)
+
+const paginator = ref({
+  page: Number(route.query.page) || 1,
+  page_size: collectionStore.defaultLimit,
+  skip: 0,
+  limit: collectionStore.defaultLimit,
+  count: 0,
+})
+
+// Form data
+const form = ref({
+  name: '',
+  warehouse_name: '',
+  download_base_url: '',
+  view_base_url: '',
+})
+
+// Permissions
+const canCreateCollections = computed(() => authStore.hasPermission('collection', 'create'))
+
+const isFormValid = computed(() => {
+  if (!form.value.name || form.value.name.length < 3) return false
+  if (!form.value.warehouse_name || form.value.warehouse_name.length < 3) return false
+
+  // URL validation check
+  if (form.value.download_base_url && rules.validUrl(form.value.download_base_url) !== true)
+    return false
+  if (form.value.view_base_url && rules.validUrl(form.value.view_base_url) !== true) return false
+
+  return true
+})
+
+// Table headers
+const headers = [
+  { title: 'Name', key: 'name', sortable: false },
+  { title: 'Paths', key: 'paths', sortable: false },
+]
+
+// Form validation rules
+const rules = {
+  required: (value: string) => !!value || 'This field is required',
+  minLength: (min: number) => (value: string) =>
+    (value && value.length >= min) || `This field must be at least ${min} characters long`,
+  validUrl: (value: string) => {
+    if (!value) return true // optional
+    try {
+      new URL(value)
+      return true
+    } catch {
+      return 'Must be a valid URL'
+    }
+  },
+}
+
+// Methods
+const createCollection = async () => {
+  const { valid } = await formRef.value?.validate()
+  if (!valid) return
+
+  isCreating.value = true
+  loadingStore.startLoading('Creating collection...')
+
+  const payload: {
+    name: string
+    warehouse_name: string
+    download_base_url?: string
+    view_base_url?: string
+  } = {
+    name: form.value.name,
+    warehouse_name: form.value.warehouse_name,
+  }
+
+  if (form.value.download_base_url) {
+    payload.download_base_url = form.value.download_base_url
+  }
+  if (form.value.view_base_url) {
+    payload.view_base_url = form.value.view_base_url
+  }
+
+  const response = await collectionStore.createCollection(payload)
+
+  if (response) {
+    notificationStore.showSuccess(`Collection "${response.name}" has been created.`)
+
+    // Reset form
+    form.value = {
+      name: '',
+      warehouse_name: warehouseStore.warehouses[0] || '',
+      download_base_url: '',
+      view_base_url: '',
+    }
+    formRef.value?.reset()
+
+    showCreateDialog.value = false
+
+    // Reload list
+    await loadData(paginator.value.limit, paginator.value.skip)
+  } else {
+    for (const error of collectionStore.errors) {
+      notificationStore.showError(error)
+    }
+  }
+
+  isCreating.value = false
+  loadingStore.stopLoading()
+}
+
+const closeCreateDialog = () => {
+  showCreateDialog.value = false
+  form.value = {
+    name: '',
+    warehouse_name: warehouseStore.warehouses.length > 0 ? warehouseStore.warehouses[0] : '',
+    download_base_url: '',
+    view_base_url: '',
+  }
+  formRef.value?.reset()
+}
+
+const loadData = async (limit: number, skip: number) => {
+  loadingStore.startLoading('Fetching collections...')
+
+  const response = await collectionStore.fetchCollections(
+    limit,
+    skip,
+    searchCollection.value || undefined,
+  )
+
+  if (response) {
+    collections.value = response
+    paginator.value = { ...collectionStore.paginator }
+    collectionStore.savePaginatorLimit(limit)
+  } else {
+    for (const error of collectionStore.errors) {
+      notificationStore.showError(error)
+    }
+  }
+  loadingStore.stopLoading()
+}
+
+const handleLimitChange = async (newLimit: number) => {
+  collectionStore.savePaginatorLimit(newLimit)
+  if (paginator.value.page != 1) {
+    paginator.value = {
+      ...paginator.value,
+      limit: newLimit,
+      page: 1,
+      skip: 0,
+    }
+  } else {
+    await loadData(newLimit, 0)
+  }
+}
+
+const handleSearchChange = async () => {
+  const query: Record<string, string> = {}
+  if (searchCollection.value) {
+    query.name = searchCollection.value
+  }
+  router.push({
+    query: Object.keys(query).length > 0 ? query : undefined,
+  })
+}
+
+// Lifecycle
+onMounted(async () => {
+  await warehouseStore.fetchWarehouses()
+  if (warehouseStore.warehouses.length > 0 && !form.value.warehouse_name) {
+    form.value.warehouse_name = warehouseStore.warehouses[0]
+  }
+})
+
+watch(
+  () => router.currentRoute.value.query,
+  async () => {
+    const query = router.currentRoute.value.query
+    let page = 1
+    if (query.page && typeof query.page === 'string') {
+      const parsedPage = parseInt(query.page, 10)
+      if (!isNaN(parsedPage) && parsedPage > 1) {
+        page = parsedPage
+      }
+    }
+    // Sync search from URL
+    if (query.name && typeof query.name === 'string') {
+      searchCollection.value = query.name
+    } else {
+      searchCollection.value = ''
+    }
+    const newSkip = (page - 1) * paginator.value.limit
+    await loadData(paginator.value.limit, newSkip)
+  },
+  { deep: true, immediate: true },
+)
+</script>
diff --git a/frontend/src/views/TitlesView.vue b/frontend/src/views/TitlesView.vue
index 5d9555b..300712f 100644
--- a/frontend/src/views/TitlesView.vue
+++ b/frontend/src/views/TitlesView.vue
@@ -1,5 +1,3 @@
-<!-- View showing all titles -->
-
 <template>
   <TitlesFilter v-if="ready" :filters="filters" @filters-changed="handleFiltersChange" />
   <TitlesTable
@@ -69,6 +67,7 @@ const errors = ref<string[]>([])
 
 const filters = ref({
   name: '',
+  collection_name: '',
 })
 const intervalId = ref<number | null>(null)
 const selectedTitles = ref<string[]>([])
@@ -89,7 +88,12 @@ async function loadData(limit: number, skip: number, hideLoading: boolean = fals
   if (!hideLoading) {
     loadingStore.startLoading('Fetching titles...')
   }
-  await titleStore.fetchTitles(limit, skip, filters.value.name || undefined)
+  await titleStore.fetchTitles(
+    limit,
+    skip,
+    filters.value.name || undefined,
+    filters.value.collection_name || undefined,
+  )
 
   titles.value = titleStore.titles
   titleStore.savePaginatorLimit(limit)
@@ -115,6 +119,7 @@ async function handleLimitChange(newLimit: number) {
 async function clearFilters() {
   filters.value = {
     name: '',
+    collection_name: '',
   }
   updateUrl()
   await loadData(paginator.value.limit, 0)
@@ -136,6 +141,9 @@ function updateUrl() {
   if (filters.value.name) {
     query.name = filters.value.name
   }
+  if (filters.value.collection_name) {
+    query.collection_name = filters.value.collection_name
+  }
 
   router.push({
     name: 'titles',
@@ -149,6 +157,9 @@ function loadFiltersFromUrl() {
   if (query.name && typeof query.name === 'string') {
     filters.value.name = query.name
   }
+  if (query.collection_name && typeof query.collection_name === 'string') {
+    filters.value.collection_name = query.collection_name
+  }
 }
 
 // Lifecycle