0% found this document useful (0 votes)
45 views8 pages

Fullstack Developer Portfolio Showcase

A portfolio for work

Uploaded by

7g7n949yqj
Copyright
© All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
45 views8 pages

Fullstack Developer Portfolio Showcase

A portfolio for work

Uploaded by

7g7n949yqj
Copyright
© All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd

Portfolio Submission Apple Developer Academy Batch 2025

Muhammad Salman Alfarisi


Diponegoro University

salmanalfarisi261002@[Link]

+6287882340660
[Link]/in/muhammadsalmoon
[Link]
Portfolio 1 / 5 MSAF

My Personal All-In-One Portfolio


About

Unique approach to a developer portfolio, with multiple features


and pages, showcasing my skills as a creativity-driven developer.

Challenge
Performance issues with using both GraphQL and Supabase
Setup Supabase’s OAuth function
TypeScript types for dynamic responses.

Ho
Using React’s suspense and loading state for API fetching
Used @supabase/ssr and auth-helpers to differentiate server
and client functions.
Automatically generate types by using Supabase’s libraries.

Made With
Next JS TailwindCSS Supabase GraphQL
Portfolio 2 / 5 Linkify

Easy to Setup Linktree


Alternative
About

Ultra performant and fully free Linktree alternative with themes,


custom domain support, and custom components.

Challenge
Making props for the components so that it is reusable
Deciding ways to handle the links by using JSON objects or a
database.

Ho
Using typescript for a typesafe attributes and a great DX
Use static JSON objects so 0 database needed.

Made With
Next JS TailwindCSS TypeScript
Portfolio 3 / 5 Terma

Uniquely Made For Uniquely


Built Portfolio

About

A terminal-styled portfolio for interactivity-crazed developers.


Easy to kickstart with no .env needed.

Challenge

Typing animations without slowing the site by using framer-


motion.

Ho

Using template literals with React Hooks and TailwindCSS.

Made With

Next JS TailwindCSS JavaScript


Portfolio 4 / 5 NextBase

Supacharge Your Supabase


Setup
About

[Link] boilerplate to kick a Next project running with Supabase


integrations. Saves you hours of programming functions from
scratch, with tutorial on each integrations.

Challenge
Slow code with complex and long codebase
Handling how SVG reacts to CSS variables.

Ho
Grouping functions and giving them type for a better DX
Using Tailwind’s selector class utilities.

Made With
Next JS Supabase TypeScript OAuth
Portfolio 5 / 5 Artickle

Automate Your Article Creation


With AI

About

With the help of AI, this website can help you create and improve

your articles with simple prompts. Made with Vercel’s AI SDK,

Gemini Generative AI, [Link], and TailwindCSS.

Challenge

AI randomness with unrelated prompts

Response formatting with Markdown.

Ho

Tinkering with the SDK attributes such as temperature and

seeding

Using react-markdown to handle the format with custom

styles for code and tables

Made With

Next JS Gemini TypeScript Vercel


Portfolio ? / ? Macintosh

Special Portfolio Template For


Macintosh Enthusiasts

About

This project is specially made as one of my portfolio project for

Apple Developer Academy enrollment. This was made with only

[Link] and Tailwind CSS. With easy to custom sections and

components.

Challenge

Apple’s squircle that cannot be made using normal border-

radius.

Ho

Using a mask on a auomatically generated svg element does

the trick.

Made With

Next JS Gemini TypeScript Vercel


Get in touch

Thank you for spending your


time with me
Email Linkedin Blog/Website

You might also like