hannydevelop / peppubuild

Build anything for the web without writing any code.

Peppubuild

Original	Built with Peppubuild

Hey, it's still 2023! If you're reading this that means you're interested in what I and some friends are cooking with Peppubuild. The goal of this project is to empower citizen developers to create web applications with ease, while also giving professional developers the flexibility and speed they need for creating an application. Simply put, anyone can build a web based application and get them running in no time with Peppubuild.

Teams can now build a functional MVP faster, utilising the already available team members. While this looks like a lot of promises, you can checkout the video below to see what a citizen developer can build with Peppubuild + Openai.

Video

If this doesn't blow your mind, you can checkout the video below to see what a professional developer can build with Peppubuild using our drag-and-drop feature.

6af3fb3e-db82-40e0-9607-2fee9e6df8a1.mp4

Well, we're still in the works for a no-code backend, checkout the where are we? section.

🎁 Why Peppubuild?

Imagine the code of your project in your hands? Imagine that you can do whatever you want with your project, host them anywhere and never worry about the safety of the platform it was built in? All of these while never bothering on vendor-locked-in and the scalability of your project.

This is all we've ever kept in mind as we build Peppubuild. We want a No-code application that provides all of the necessary flexibility and freedom for our users. Peppubuild is an alternative for Bubble and other tools, if you want to build an application using tools and frameworks that you are familiar with.

Here's what Peppubuild offers.

Peppubuild	Others
Retrieve your codes as you build.	Can't get access to your code.
Build on frameworks or technologies you're familiar with.	Build on tool's available framework.
Deploy project to any platform of your choice.	Deploy project to tool's platform of choice only.
Flexibility, you have full control of your project, no vendor locked-in.	Deploy project to tool's platform of choice only, posibility of vendor locked-in.

🪜 Structure

This repository contains the NodeJs code for Peppubuild (backend). The desktop application can be found here, you can read the instructions and download the package that suits you. The desktop application and plugins are added as a git submodule in the codebase so they're pretty easy to find.

✅ Where are we?

• Dec 16 - You can now build a website with HTML and CSS, extract your code and deploy them wherever you like. Checkout this example.

• Dec 18 - You can now instruct AI to create a website for you, using the screenshot of your choice. Checkout this example to see how to setup and create your website.

• Dec 20 - You can now receive prompts to update your Peppubuild desktop application whenever there's a new version release.

✨ Quick Start

Please checkout the Instructions version of the desktop repository on how to setup and start using Peppubuild. If you need more help, try the documentation guide.

peppubuild's Issues

First Iteration of Backend

Describe the solution you'd like
A crude but clear iteration for a backend. Nothing serious, it doesn't have to integrate services. However, the backend should incorporate NodeJs/Express and should run basic CRUD actions.

Save Panel

Work on the save button in the panel section. This will include the following:

• A save command which collects changes and appropriate them to files.
• Work on communicating with fs when making changes.
• Add modal on successful save

Class for Style

Is your feature request related to a problem? Please describe.

It is redundant if users have to create and repeat classes from scratch whenever they wish to create a component.

Describe the solution you'd like

A class for components that allows users create re-useable components in Peppubuild.

Add Git

Describe the solution you'd like
Synchronise Peppubuild Project to Git. First, initialise a .peppubuild file that contains all the necessary information for the project. A sync to Git button or something of some sort should trigger a workflow to save changes to the web hosting service of choice.

Allow Editing on VsCode

Is your feature request related to a problem? Please describe.

Currently when you edit changes from VScode, you only see the changes made and saved in the editor.

Describe the solution you'd like

A sync change from file button in each file from the editor so it loads html/css from the file instead of using the saved changes.

Self-hosted Release

Project Name

Add a sidebar input to add project name.

• Sync project name to db.

Subscription model

Describe the solution you'd like
I would like a subscription model for Peppubuild users, separating freemium and pro users. First, separate users into freemium and pro users, with freemium users getting little, restricted access and pro users getting all features. Divide pro users into two segments too, where people pay or use the referral link. Referral of 5 users to 1 month and a maximum of 10 users to 2 months for free.

Additional context
I would suggest integrating the following steps:

• Create license key (https://github.com/indianazhao/nodejs-license-key).
• Make sure referral emails are not catfish with firebase verification.
• Create an onboarding flow and subscription tracker.

Change Media Query for Devices

Is your feature request related to a problem? Please describe.

In some devices, websites are unresponsive. This makes it difficult for non-developers to fix.

Describe the solution you'd like

Change the viewport for each device in Peppubuild

Restrict alpha version

Is your feature request related to a problem? Please describe.
We are launching our application using the current MVP version we have currently. However, it is limited as we have only figured out the frontend version and some bugs in the backend part.

Describe the solution you'd like
Let us restrict the alpha release to the frontend version and then we can work it down to the backend and fullstack version.

Additional context
Add alerts to show that the full-stack and backend route are still a work in progress and not available for alpha1.

Automatic Update

Before publishing the alpha version of Peppubuild, we want to include an update manager. This manager will compare the current version of Peppubuild and the version currently installed in the user's system and update. This is because we are experimenting a lot of things and we want the user to be up to date with current changes.

A pop-up to trigger manual download or automatically downloading after every week will be great, something like scheduling updates.

Basic Templates

Describe the solution you'd like
Add a minimum of five basic (free) templates for users to build with.

Redesign peppubuild.com

Describe the solution you'd like
Redesign the Peppubuild website with the Peppubuild Editor.

Add Bootstrap 5 to Peppubuild

Is your feature request related to a problem? Please describe.

We are targeting no coders as well as software developers. We have our software developers covered as the style manager uses jargons like padding, margin to style components.

Describe the solution you'd like

The jargons may seem confusing for non developers as they can't understand these terms. Instead, we will use Bootstrap for pre-styled components.

Describe alternatives you've considered

N/A

Additional context
N/A

Update manager for Peppubuild

Is your feature request related to a problem? Please describe.
We are experimenting with Peppubuild, therefore we are constantly changing things in the main repository.

Describe the solution you'd like
I will like a update manager script that checks the repository and the pkg executable every week and does a manual or automatic update.

Describe alternatives you've considered
I have considered uninstalling the present download and installing the updated version, this is a lot of work.

Additional context
I would suggest a close look at this discussion (https://stackoverflow.com/questions/14006439/how-to-create-a-self-updating-node-js-application) and this npm package https://www.npmjs.com/package/auto-git-update

Peppu Logo

Add peppubuild's logo to panel.

• Allow peppubuild's logo open the view-container panel. or just a logo that navigates user to peppubuild home page

Publish alpha1

Additional context
Steps:

• Package with pkg
• Build NodeJs application
• Publish package
• Publish on Github packages

Structure Application

Work on structure of peppubuild.

• File templating and creation using fs.
• Add views using ejs.
• Work on sharing the same nodejs app for both backends.