Delos-343/Official-Personal-Portfolio

Stars
2
Language
HTML
Created over 2 years ago
Updated over 2 years ago

Delos-343/Official-Personal-Portfolio

Delos-343

There are no reviews yet. Be the first to send feedback to the community and the maintainers!

My official, simultaneously personal and professional, portfolio website. One of my greatest achievements as a frontend developer, this build was made with Emmet, Bootstrap 5, and JavaScript [& jQuery].

Hulu-2.0

A Hulu clone made with NEXT.js and Tailwind using the MovieDB API ~ with a test / production build set to be hosted on Netlify or Vercel.

Syifa-s-FP-PHP

A helper mini-project from my time as a freelance / volunteer consultant regarding web development. This project was an aid to a colleague for her final project in the Web Development course during her academic studies in ITS Surabaya.

Movie-DB

A starter SvelteKit project using the MovieDB API to fetch and return film data, complete with a search filter function to sort user-based inputs.

spotify-clone

A web / PWA clone built with NEXT.JS and Tailwind CSS, complete with the Spotify API, a middleware, as well as login form-validation with access token generation.

Modern-UI

A static React App created as my first complete project as a modern JavaScript developer / frontend engineer.

My-E.BLOG

A [very] personal project: an e-blog / web SPA made with NEXT.js, Tailwind, and SCSS, complete with a GraphQL content-management system.

Shopee-User-Interview-2

Alternative title: "CSS Waves". This was a Live demo and test from my user interview with the Southeast Asian [corporate] unicorn, Shopee.

Broaden-Creative-by-Expecto

A company website project from Broaden Creative by Expecto, a digital marketing firm that promotes the growth of small to medium-scale businesses and startups.

DW-s-Quiz-App

A helper project done together with a close friend during his independent [bootcamp] study period at Alterra Academy.

IlmuDewantara

The beginning of a new startup project, serving as an online educational platform and forum for university students across Indonesia. This Bootstrap-5 landing page serves to showcase the startup's core theme, fundamental principles, and planned services.

Tokopedia-Tech-Workshop-2021

These projects were part of a one-week programme and private events hosted for members of the Tokopedia Meetup group, by official Tokopedia staff and software engineering veterans.

Spotify-2.0

A web / PWA clone built with NEXT.js and Tailwind, complete with the Spotify API, a middleware, as well as login form-validation with access token generation.

Einfacher-Musiker-Spieler

The title says it all. Just use an assets folder to store images and such, then source it to an array for indexing.

FCC_Survey-Form

Another FreeCodeCamp project regarding the building of a static login form, and part of the Responsive Web Design course.

BPJPH-Wikia

Drawing-Board-App

A simple, fun side-project on constructing a digital drawing board with holographic / glassmorphic themes.

Dribble-App-UI

A wellness app UI based on / inspired by a select Dribbble design. Made with Flutter with custom widgets.

Digital-Brochure

A digital portfolio [header] section, mobile-first responsive, and comes with dark mode.

The-Expanse-Website

A landing page built as a tribute to my favorite [hard] science-fiction book & TV series, The Expanse ~ James S. A. Corey . Made with React and SASS.

Snake-Game

IDe-IlmuDewantara

The beginning of a new startup project, serving as an online educational platform and forum for university students across Indonesia.

Cute-Choobz

A cute animated sprite made from base HTML attributes and CSS components sourced from their standard libraries.

404-ERROR

*confused unga bunga*

Linktree-3.0

Another day, another clone ~ this time as a set of practices on new JS frameworks. This simple build was constructed with Svelte.

Design-Course-Portfolio

A modern, minimalist portfolio done as part of the IDCAMP 2022 scholarship program. Made with React and Tailwind CSS.

Animated-Profile-Card

An animated profile card or banner to display client-side information in the form of static markups (HTML).

Chat-Network

3D-SaaS

Fiction-Books

my-react-app

A React boilerplate.

Hulu-2.0-PWA

A Hulu Clone, designed to be as close and legitimate to the original site / application as much as possible. This build is constructed with NEXT.JS and Tailwind CSS.

React-Portfolio

A "back-to-the-basics" frontend development practice in the form of an online portfolio. Made with React and Tailwind CSS with a GetForm.io POST method.

Music-Player-2.0

Another take on a music player UI design with local storage to store .MP3 or image assets.

Linktree-Clone

A flashy Linktree clone made with custom components that are interactive and animated.

KK-FP_HoKKi-Group

Jupyter Notebook

my-next-app

A NEXT.js boilerplate.

C-and-CPP-for-Competitive-Programming

An old repo from my competitive programming days in the first and second semesters of university. Written in either C or C++.

BMS-HMTL_Dasar-Web

A mini-project and simulation for the Basic Media Schooling program for Environmental Engineering students in ITS.

Neumorphism-Debit-Card

A neumorphism design study using static HTML and CSS components to make a digital debit card piece.

Glassmorphism-Flip-Card

A glassmorphism design study utilizing HTML and CSS, in the form of a digital flip card.

Flutter-UI-Test

A personal tryout in [frontend] mobile development under the Android operating system, specifically to test widgets and widget states in respect to component layouts and code syntax.

my-vue-project

A Vue.js boilerplate.

Single-Page-Application

A simple, interactable, and animated single-page application (SPA) built with base HTML, CSS, and JS.

my-nuxt-app

A Nuxt,js boilerplate.

REACTJS__Telkom-Corporate-University-

Buggy-Box

A modular yet half-debugged box component used as a basic profile card / user profile.

Splitscreen-Brochure

An alternative take on the digital portfolio [header] section, this time with an interactable hover:state determined by mouseX and mouseY vectors (mouse inputs).

Minecraft-Clone

For the Grafika Komputer final project in ITS.

FCC_Tribute-Page

A tribute [web] page in regards to the host of the popular YouTube show, Hot Ones; named Sean Evans. This was supposed to be for the Responsive Web Design certification by FreeCodeCamp.

TEDX-ITS

A short collection of some components I built during my intermittent time in TEDX ITS.

Cpt-Java-Trip

Birthday-Card

A special gift for a special someone on his / her special day.

3D-Holographic-Carousel

An animated 3D carousel designed to as a character selection feature for a game project under a quick weekend hackathon.

Flutter-Live_Radio-Player

For a friend's final-year project and thesis to make a radio livestreaming platform UI. Made with Flutter.

Calculater-with-Dark-Mode

A calculator UI with basic arithmetic operations and logical processing, decorated with an additional dark mode function.

IPL-Custom-Server

Indonesia-Peerleaders-Website's backend utility functions and server-side rendering + storage tools.

Isometric-Profile-Cards

An isometic UI design study with some profile card UI and hover-state + onClick animations.

Disney-Plus-2.0

This Disney+ Clone is but one part of a lengthy chain of projects for my personal skillbuilding journey to train as a modern JavaScript developer. This Jamstack build was created with React (Firebase + Styled Components + Redux).

Dynamic-Neumorphic-Button

An interactable mini-game using a button component styled in the Neumorphism theme.

Bootstrap-Company-Website

An amateur-level project jumpstarted as an introduction to web development frameworks, starting with CSS; in this case, Bootstrap 5.

MyITS-Login-Form-Clone

My first attempt to clone a web UI component via full-code methodology. I chose my university's login form as a direct inspiration and base boilerplate.

Color-Picker

A workspace test - color and background theme picker for a company project.

Starbucks-2.0

A Starbucks clone made with the fullstack Laravel framework.

Delos-343

React-Character-Selector

An object-oriented minigame design used to match-select characters in the form of a QTE puzzle.

Non-Fiction-Books

The-Duality-of-Man

Positive, negative. Autobots, Decepticons. Skate fast, eat a**.

Three.JS-3D-Modeling

A beginner practice using the Three.JS library for 3D modeling web components.

PT-BSL-Landing-Page

A company profile and landing page for PT BSL {Wahana Express}. Made with NEXT.JS and Tailwind CSS.

Tinder-Clone

A basic Tinder Clone, as part of my third attempt to clone an application. This is more of a component and animation study with an emphasis on user-interactability on the slide / swipe function.

React-Digital-Clock

A digital clock + timer built with React.

HimaTekkomITS-Admin-Dashboard

HimaTekkom-ITS-App

Viding.co-Landing-Page

A repo to store the src files, build folders, and design system (frontend) of a landing page for Viding.co. Made with React JS.

Linktree-Clone-2.0

A second iteration for a Linktree clone, this time being more rooted to the original UI and function.

my-svelte-app

A SvelteKit boilerplate.

SCSS-Animated-Slider

SASSiness and some nice transition animation whilst playing with the SCSS preprocessor.

IlmuDewantara-App-UI

An additional, acceleration practice with Flutter to make UI designs for an online course application.

Simple-Chatbot

01000001 01101000 00100000 01110011 01101000 01101001 01110100 00101100 00100000 01100001 01101000 00100000 01100110 01110101 01100011 01101011

IDe-IlmuDewantara-WebApp

An evolution of the IlmuDewantara website into a fullstack CRUD app utilizing more advanced tools and technologies, specifically NEXT,js, Tailwind CSS, and DatoCMS [GraphQL].

Indonesia-Peerleaders-Website

A total, modernized redesign of the Indonesia Peerleaders website, user-friendly and mobile-responsive. Made with React and Tailwind CSS.

Coffee-App-UI

"A cup of caffeine a day keeps the bugs away." --- Another Flutter practice on building interactable widgets for UI design, this time for a café app.

GenB-Data-Website

UI/UX and Frontend Development combined. This was my last major project as a freelancing UI/UX Designer in GenB Data.

GenB-Creative-Login-Form

My first project as a front-end engineer intern in the digital marketing startup, GenB Creative ~ now known as Broaden Creative [by Expecto].

First-Portfolio

My first ever personal portfolio as a junior frontend developer, complete with a single page presentation layer, animations, and interactive components. Built with base HTML, CSS, and JS.

Brutalist-Calculator

Some brutalism design study in the form of a digital calculator and marked by buggy arithmetic functions. More form over function, really :v

Atlas-Landing-Page

An adorable landing page, complete with animations and a modal. Made with React, Styled-Components, and Framer Motion.

Personal-Portfolio-2.0

My second final project as an amateur frontend engineer; an upgrade / evolution of my first ever online portfolio, albeit with a focus on brutalism-minimalism-post_modernism. Built with Emmet, CSS, and JavaScript.