You are browsing as a guest. Sign up (or log in) to start making projects!

Manenti

@Manenti

Joined June 2nd, 2026

  • 29Devlogs
  • 6Projects
  • 3Ships
  • 16Votes
Arthur | 🇧🇷
Developer by day, high-pressure rocket builder by weekend. I’m into Linux customization, fitness, and mastering the Japanese language (currently at an N5 level). Big fan of Vinland Saga and Horimiya. Always chasing the next challenge, whether it’s a 52/60 on a technical exam or a cold shower streak.
Ship

I built LaunchPad, a quality-of-life web app that helps makers organize their projects and generate useful submission materials faster. The app lets users create a local profile, save project information, add links such as GitHub and demo URLs, select the type of project, and choose which resources they want to generate. From one saved project, LaunchPad can generate materials like a README template, a GitHub description, a DevLog, a submission checklist, an AI usage statement, and a project submission text. Users can also copy or download the generated resources directly from the project page.

The most challenging part was connecting the whole front-end flow in a clean way. I had to work with React Router protected routes, localStorage persistence, form actions, dynamic project pages, and reusable generator functions. Another challenge was making the app feel simple and useful instead of overloaded, because the main goal was to remove friction from a repetitive workflow.

I am most proud of being able to apply the front-end knowledge I have been studying recently and turn it into a complete, working project with a satisfying final result. This project helped me practice React, Vite, TailwindCSS, routing, local data storage, and UI organization in a real use case. I am also proud that the tool solves a problem I personally have when submitting projects: rewriting the same information across README files, devlogs, descriptions, and checklists.

To test the project, open the live demo, create a simple local login, and then create a new project. Add a project name, description, type, technologies, GitHub link, demo link, challenges, and what you learned. After saving it, open the project from the dashboard and try generating, copying, and downloading the selected resources. All data is stored locally in the browser using localStorage, so no real account or backend is required.

Try project → See source code →
Ship

For this project, I made **ManentiOS**, a personal web operating system that runs directly in the browser. It includes a login-style onboarding screen, a desktop interface, draggable and closable windows, a top bar with a clock, and multiple apps such as FrostLog, Calculator, and a Projects portfolio app.

The most challenging part was simulating the behavior of a real operating system inside a website. I had to learn how to manage draggable windows, opening and closing apps, window layering with z-index, desktop icons, and React state across different components. I had never built anything like an OS interface before, so figuring out how all these pieces should work together was a big challenge.

I am most proud that I was able to create something that actually feels like a small operating system. I also like the visual identity I built for it, mixing a winter, forest, rain-inspired atmosphere with a clean technological interface. This project helped me practice React, TailwindCSS, componentization, UI design, and interactive front-end logic.

To test the project, open the live demo, go through the login-style screen, and enter ManentiOS. You can click or double-click the desktop icons to open apps, drag the windows around, close them, reopen them, and explore the Projects app to see some of my other work.

Try project → See source code →
Open comments for this post

1h 32m 57s logged

This update focused on the project detail flow. I created a dedicated page for each project, updated the routes so users can open a project directly from the dashboard, and added an “Open project” action to the project cards. I also polished the styling of the project page to keep the new flow consistent with the rest of the app.

I made a few small improvements to the generators utility too, so it can handle project data more reliably when building formatted files like README, DevLog, checklist, and submission text.

This update focused on the project detail flow. I created a dedicated page for each project, updated the routes so users can open a project directly from the dashboard, and added an “Open project” action to the project cards. I also polished the styling of the project page to keep the new flow consistent with the rest of the app.

I made a few small improvements to the generators utility too, so it can handle project data more reliably when building formatted files like README, DevLog, checklist, and submission text.

Replying to @Manenti

0
2
Open comments for this post

1h 16m 30s logged

Since the last devlog, I focused on the generators layer of the project. I created a utility that turns a project’s data into formatted output files, including README, GitHub description, DevLog, checklist, AI usage statement, and submission text.

I also added filename generation for each resource so the exported content is organized and easy to reuse. This gave the app its first real content-generation workflow instead of just storing project information.

Since the last devlog, I focused on the generators layer of the project. I created a utility that turns a project’s data into formatted output files, including README, GitHub description, DevLog, checklist, AI usage statement, and submission text.

I also added filename generation for each resource so the exported content is organized and easy to reuse. This gave the app its first real content-generation workflow instead of just storing project information.

Replying to @Manenti

0
2
Open comments for this post

2h 51m 37s logged

Since the last devlog, I moved the project from a basic routed app into a more complete project-management flow. I set up a lightweight MVC structure for projects, added localStorage-backed project persistence, and refactored shared UI into reusable components like Button and InputField. I also started importing a custom font to make the interface feel less generic.

On the product side, I built the create-project screen with fields for project metadata, links, technologies, challenges, learnings, and generator selection, plus validation and save/cancel actions. I then expanded the dashboard into a real project overview that reads saved projects, handles the empty state, greets the logged-in user, and links into the new project flow. After that, I polished the styling of both the dashboard and the new project page so the app feels more consistent and usable

Since the last devlog, I moved the project from a basic routed app into a more complete project-management flow. I set up a lightweight MVC structure for projects, added localStorage-backed project persistence, and refactored shared UI into reusable components like Button and InputField. I also started importing a custom font to make the interface feel less generic.

On the product side, I built the create-project screen with fields for project metadata, links, technologies, challenges, learnings, and generator selection, plus validation and save/cancel actions. I then expanded the dashboard into a real project overview that reads saved projects, handles the empty state, greets the logged-in user, and links into the new project flow. After that, I polished the styling of both the dashboard and the new project page so the app feels more consistent and usable

Replying to @Manenti

0
1
Open comments for this post

39m 36s logged

Since the last update, I moved the project from a simple login prototype into a small routed app with actual navigation flow. I installed React Router, created public and protected routes, and wired the login so it now sends the user to the dashboard after saving their data locally.

I also built a first provisional dashboard with a greeting, logout action, and a placeholder projects section. After that, I refined the dashboard styling and started polishing the overall presentation by importing a font and improving the visual structure.

Since the last update, I moved the project from a simple login prototype into a small routed app with actual navigation flow. I installed React Router, created public and protected routes, and wired the login so it now sends the user to the dashboard after saving their data locally.

I also built a first provisional dashboard with a greeting, logout action, and a placeholder projects section. After that, I refined the dashboard styling and started polishing the overall presentation by importing a font and improving the visual structure.

Replying to @Manenti

0
4
Open comments for this post

49m 44s logged

I started the project with Vite and React and installed Tailwind CSS to speed up the interface. I structured the application to display a login screen as the app’s entry point. I created the basis of the authentication flow with simple name and email validation. I added local persistence with localStorage to save user data in this prototype. I adjusted the form fields and then refined the page’s appearance with a more polished and responsive layout.

I started the project with Vite and React and installed Tailwind CSS to speed up the interface. I structured the application to display a login screen as the app’s entry point. I created the basis of the authentication flow with simple name and email validation. I added local persistence with localStorage to save user data in this prototype. I adjusted the form fields and then refined the page’s appearance with a more polished and responsive layout.

Replying to @Manenti

0
1
Open comments for this post

46m 8s logged

Since the last dev log, I improved the first screen of ManentiOS by turning it into a login-style onboarding page inspired by Windows, but with the winter-tech visual identity of the project.

I also made the buttons functional, allowing users to enter the OS normally or open specific apps directly, like the Projects app and FrostLog.

After that, I worked on the portfolio experience by improving the Projects app and filling it with my best GitHub projects, including ManentiOS, PoupApp, Manenti Slack Bot, Custom Macropad, and other web/full-stack projects.

Now ManentiOS has a stronger first impression, a more useful portfolio section, and feels much more like a complete personal WebOS.

Since the last dev log, I improved the first screen of ManentiOS by turning it into a login-style onboarding page inspired by Windows, but with the winter-tech visual identity of the project.

I also made the buttons functional, allowing users to enter the OS normally or open specific apps directly, like the Projects app and FrostLog.

After that, I worked on the portfolio experience by improving the Projects app and filling it with my best GitHub projects, including ManentiOS, PoupApp, Manenti Slack Bot, Custom Macropad, and other web/full-stack projects.

Now ManentiOS has a stronger first impression, a more useful portfolio section, and feels much more like a complete personal WebOS.

Replying to @Manenti

0
1
Open comments for this post

1h 30m 14s logged

Since the last dev log, I completed the final WebOS tutorial step by building more advanced apps for ManentiOS. This stage was more open-ended, so I decided to create two useful apps: a Calculator and a Projects portfolio app.

I added new desktop icons, connected them to draggable app windows, and improved the window system to support multiple apps more easily. The Calculator now performs basic operations, while the Projects app showcases my work inside the OS.

Since the last dev log, I completed the final WebOS tutorial step by building more advanced apps for ManentiOS. This stage was more open-ended, so I decided to create two useful apps: a Calculator and a Projects portfolio app.

I added new desktop icons, connected them to draggable app windows, and improved the window system to support multiple apps more easily. The Calculator now performs basic operations, while the Projects app showcases my work inside the OS.

Replying to @Manenti

0
3
Open comments for this post

1h 4m 36s logged

Since the last dev log, I created the first real app for ManentiOS: FrostLog, a winter-tech journal app with selectable entries, a desktop icon, and its own draggable window. This followed the tutorial step focused on adding the first app to the WebOS.

I also improved the desktop behavior by fixing the z-index system, so app windows now appear in front of desktop icons while the top bar stays above everything.

ManentiOS now feels more like a real WebOS, with icons, apps, draggable windows, and better window layering.

Since the last dev log, I created the first real app for ManentiOS: FrostLog, a winter-tech journal app with selectable entries, a desktop icon, and its own draggable window. This followed the tutorial step focused on adding the first app to the WebOS.

I also improved the desktop behavior by fixing the z-index system, so app windows now appear in front of desktop icons while the top bar stays above everything.

ManentiOS now feels more like a real WebOS, with icons, apps, draggable windows, and better window layering.

Replying to @Manenti

0
3
Open comments for this post

44m 26s logged

Since the last dev log, I continued developing ManentiOS by following the next WebOS tutorial step and adapting it to my React + TailwindCSS structure. The goal was to make the desktop window feel more like a real operating system window.

I created a reusable OSWindow component with support for dragging, closing, and reopening windows. I also updated the desktop so the welcome window can be opened again from the top bar by clicking on ManentiOS.

Instead of using plain JavaScript with querySelector, I used React state, props, refs, and pointer events to keep the logic more organized and component-based.

Since the last dev log, I continued developing ManentiOS by following the next WebOS tutorial step and adapting it to my React + TailwindCSS structure. The goal was to make the desktop window feel more like a real operating system window.

I created a reusable OSWindow component with support for dragging, closing, and reopening windows. I also updated the desktop so the welcome window can be opened again from the top bar by clicking on ManentiOS.

Instead of using plain JavaScript with querySelector, I used React state, props, refs, and pointer events to keep the logic more organized and component-based.

Replying to @Manenti

0
2
Open comments for this post

1h 4m 20s logged

Since the last dev log, I continued working on ManentiOS by defining a stronger visual direction for the project: a winter-inspired interface with forests, rain, landscapes, and a subtle technological touch.

I also moved on to the second part of the WebOS tutorial and adapted the concepts from HTML, CSS, and JavaScript into my current React + JSX + TailwindCSS structure. Instead of using plain HTML and inline styles, I planned the desktop as reusable components.

I created the idea for the main desktop screen, including a background wallpaper, a glass-style welcome window, a top bar, and a live clock using React state and effects. This keeps the project aligned with the tutorial while making the code cleaner and more scalable.

Since the last dev log, I continued working on ManentiOS by defining a stronger visual direction for the project: a winter-inspired interface with forests, rain, landscapes, and a subtle technological touch.

I also moved on to the second part of the WebOS tutorial and adapted the concepts from HTML, CSS, and JavaScript into my current React + JSX + TailwindCSS structure. Instead of using plain HTML and inline styles, I planned the desktop as reusable components.

I created the idea for the main desktop screen, including a background wallpaper, a glass-style welcome window, a top bar, and a live clock using React state and effects. This keeps the project aligned with the tutorial while making the code cleaner and more scalable.

Replying to @Manenti

0
2
Open comments for this post

1h 7m 17s logged

Today I started working on ManentiOS, my personal web operating system. I chose the main theme, created a futuristic project banner, and wrote a short description for the project.

I also built the first onboarding screen using React, JSX, and TailwindCSS. Then, I organized the code into reusable components like FeatureCard, ActionButton, and Onboarding.

So far, the project has a clear identity, a visual style, and the beginning of a clean, componentized interface. My next step is to build the main desktop screen and add interactive apps.

Today I started working on ManentiOS, my personal web operating system. I chose the main theme, created a futuristic project banner, and wrote a short description for the project.

I also built the first onboarding screen using React, JSX, and TailwindCSS. Then, I organized the code into reusable components like FeatureCard, ActionButton, and Onboarding.

So far, the project has a clear identity, a visual style, and the beginning of a clean, componentized interface. My next step is to build the main desktop screen and add interactive apps.

Replying to @Manenti

0
1
Open comments for this post

21m 54s logged

I created the commands “/manenti-quote” and “/manenti-joke”, they serve to launch stoic phrases and tell all sorts of jokes.

I created the commands “/manenti-quote” and “/manenti-joke”, they serve to launch stoic phrases and tell all sorts of jokes.

Replying to @Manenti

0
3
Open comments for this post

35m 2s logged

I added two commands to search for Pokémon and anime using APIs.

I added two commands to search for Pokémon and anime using APIs.

Replying to @Manenti

0
4
Open comments for this post

28m 26s logged

Creating the Project. I configured the settings on the Slack API website, then started coding the project, installing dependencies and creating the first three commands: “/manenti-hw”, “/manenti-help”, and “/manenti-cat”.

Creating the Project. I configured the settings on the Slack API website, then started coding the project, installing dependencies and creating the first three commands: “/manenti-hw”, “/manenti-help”, and “/manenti-cat”.

Replying to @Manenti

0
4
Open comments for this post

1h 19m 21s logged

Creating a grid structure for the Cards and creating, componentizing, and styling the third and fourth Cards.

Creating a grid structure for the Cards and creating, componentizing, and styling the third and fourth Cards.

Replying to @Manenti

0
4
Open comments for this post

23m 39s logged

Creating and styling Typography and Card components

Creating and styling Typography and Card components

Replying to @Manenti

0
2
Open comments for this post

21m 18s logged

Importing icons, creating and styling the Main and SearchInput components

Importing icons, creating and styling the Main and SearchInput components

Replying to @Manenti

0
3
Open comments for this post

29m 14s logged

Creating de sidebar and importing the global font family Work Sans

Creating de sidebar and importing the global font family Work Sans

Replying to @Manenti

0
3
Loading more…

Followers

Loading…