Git Product home page Git Product logo

gramateria's Introduction

Gramateria - v1.0.6

Gramateria a drag and drop web builder which is built with GrapesJS but with a different look, blocks and components. And v1.0.6 is using Bootstrap 5, can generate a Desktop app with ElectronJS and can deploy to Netlify.

DEMO


Gramateria v1.0.6 is a re-rewritten version that changed many features and code.

Although I have stopped developing this app for a while, there are still many users and I feel a little bad because of my old/dirty codes. So I decided to refactor the codes and add some features to be more useful for developers and non-developers in this v1.0.6.

Installation

npm install

npm start

Development

Compile sources

npm run dev

npm run watch

npm run prod

Build desktop app

npm run pack

Check export folder after running npm run pack command.


v1.0.6 Change logs

  • Change electron-packager to electron-builder
  • Change Materialize CSS to Bootstrap 5
  • Upgrade Grapesjs to v0.17.19 (latest version)
  • Added Nelify deployment
  • Messy codes to modular code
  • Added laravel mix for script compling
  • Added new blocks
  • Add Notyf for toast messages
  • Remove Gapesjs export plugin
  • Remove dashboard version in v1.0.4 which was built with vue.js, element UI and firebase. reason of removing dashboard

Reason of removing dashboard

Because making Gramateria to compatible with Vue, ElementUI and Firebase versions is not an easy task for me. And I want to keep Gramateria as a desktop based app.

Roadmap

  • Add more blocks
  • Change icons for section blocks
  • Make it available for linux and window.
  • Add more SEO tags
  • Build multiple pages
  • Improve UI

Credits

Show your support by ๐ŸŒŸ the project, thanks.


Buy Me a coffee

gramateria's People

Contributors

dependabot[bot] avatar lunarequest avatar ronaldaug avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

gramateria's Issues

Add an "Import from URL" feature

An "Import from URL" feature would be super useful.

Perhaps with an option to make absolute URLs from the domain relative to the local imported copies.

Add more icons for packaging

generally on linux applications ship a variety of sizes on icons to allow better scaling. this is generally in the range of 32x32 to 512x512 with the size increasing by double so 32x32,64x64 and so on can you add these? it would greatly help with the flatpak

Can't download from Google Drive

Appreciate you don't want to host file share
But Google blocks me for some reason.
Maybe because I am Google-free as far as possible.
Is there an alternative download location ?

save file

When try to save file appear
No database for this version but your work is automatically saved in localstorage.
But where?

multipage manager [request]

I do not know if it is possible, but I would like to request some implementation of pages manager, duplicating them or creating new ones from the beginning.

change background image in parallax?

Hello,
Thank you for sharing this project! I really hope it's not dead and not sure why there are 2 identical gramateria projects on github.

I noticed that you can't easily change a background picture. It's missing a field with img src.
The only way is to save the gram file, tweak it and load it again.

Take care,

Windows build

How do we get gramateria on windows. Do I need to clone repo?

I forked the repo and built the windows version

Hello Ronald ๐Ÿ‘‹
and thank you spending your time in for helping others

there's actually lots of issues and i would like to help:

  • the css code duplicate all the time
  • saveing the project data as a gram file is okay but i think there's a better way instead of putting the html code inside the file
  • about Gramateria in the menu doesn't work on windows

i would like contribute and solve the css code duplication issue
and hopefully add more features and most importantly test code

Panel Version

Hello Sir, May I have source code of Gramateria panel version ? Pls sir

Generate liquid template / partials from editor

Hi!
This project is great and shows great promise! Have you ever thought about exporting as a liquid template instead of html? You already have the partials as building blocks in the editor, so this should be possible without restructuring the code.
Liquid templates can be used to power your github-pages (or Jekyll and so on) :) so this would open up a lot of use cases for your app!

Let me know if I can be of any help!
Cheers!

add multiple block manager option

I would like to be able to make separate blocks in to groups for different icon on panel. For instance I have buttons A, B & C on panel . "A" block manager will contain 1,2,3 components, "B" block manager will contain 4,5,6 components and so on,

CSS Massive Rule Duplication

CSS Massive Duplication
Now i have 9k lines of Duplicated CSS rule which is memory consuming (and reduce performance too)
i recommend to check first if the same rule exist or not

Thank You! (This is the best offline drag-and-drop tool!)

Can i use inside a div as part of a larger form?

Hi!

I have a self-developed admin panel that I use for my clients' websites, on it I used a module for grapesjs called grapesjs-blocks-bootstrap5, but I needed to reinstall the node-modules folder and it looks like the module developer removed all his traces from the internet, so he broke my panel.
I wonder if I could use Gramateria inside a div and play its content to a hidden input?

My dashboard is made with PHP so I would need this post to save along with the other fields I use for pages. I ask because I saw in the readme that the purpose of the project is to be used as a standalone application.

This is the way I use it today and it would need it to work:
image

open source alternative to webflow

Hello

I'm the maintainer of silex website builder and I started to work on the v3 which will include grapesjs and be a real alternative to Webflow (right now you can already read about silex being the best Webflow alternative but it is not the case yet)

@ronaldaug would you be interested in a collaboration ? I'm open to pretty much anything as long as it leads to a viable free and open source alternative to Webflow

Just brainstorming here, please feel free to jump in @ALL :))

error on line 575 from webbrowser common

It is not possible to export pages from Chrome because an error is appearing on line 575 of the code. I am trying to package the application using a proprietary framework that uses a Chrome rendering engine, but the error persists.

Any idea ?

Drag and drop duplicates components

Dragging and dropping components in gramateria duplicates the component. Seems to me this should move the component, if this is intentional is this configurable/overrideable?

materialize_drag_and_drop_duplicate

Unable to upload image.

Hello. I am now using gramateria with desktop version (just click the index.html). I was trying to upload background image but when I clicked the drop area, I could choose file. However, when I chose the image file that I wanted to apply, there was no reaction. Same situation in dragging file. I also tried to upload image through the image block, I could choose those default images but uploading my own one.
Just wonder if I missed anything to upload image? Many thanks!

Download problem

This project was amazing!
l would like to add/change some stuff from the website, nevertheless, When l download it; It does not download the whole thing.

Credit all to you for making this AMAZING project

Signup uses Login Format

image

This is what I am facing. Perhaps the "Sign In" button could be changed to "Sign Up" and the Username Filed changed to email?

Thank you for your time.

Differences compared to GrapesJS?

It'd be good have a section in the README about how this project and its goals are different from GrapesJS as that too is an open-source project under active development.

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.