← Back

CSS Frameworks: Pixly

Pixly screenshot — Social app with CRUD, follows, reactions and comments.

Overview

Pixly is a responsive social app built with Vanilla JS, Vite, and Tailwind, powered by the Noroff Social API. Users can register/log in, create/read/update/delete their own posts, follow other profiles, and interact via reactions and comments. The focus is on clear flows, solid API handling, and a consistent, accessible UI.

Tech & Responsibilities

Stack: Vanilla JavaScript, Vite, Tailwind CSS
Core CRUD: Designed and implemented create/read/update/delete flows for posts
API: Noroff Social API (auth, posts, profiles, reactions, comments)
UX: Profile pages, follow/unfollow, post detail with reactions & comments
Build & Tools: VS Code, Figma; Netlify for deployment
Role: End-to-end front-end — UI, state, validation, API integration, deployment

Improvements

Follow/Unfollow + profile navigation: Enabled viewing other user profiles, following/unfollowing, and navigating smoothly between users.
Reactions & comments: Added reaction toggles and improved comment UX on post detail pages.
Teacher feedback implementation: Addressed UX issues and code concerns raised during review for a cleaner and more consistent experience.
Layout shift fixes: Reduced cumulative layout shift (CLS) by improving image sizing and loading behaviors.
README & documentation: Updated project setup steps and usage notes to aid reviewers.

Outcome

A clearer social experience with reliable profile navigation, added post interactions, and fewer layout shifts. Cleaned up after the teacher feedback from the initial submission.