As promised in my previous post we're beginning a series of explanation articles of GlueCodes Platform. What it is can be found on our website but why did we come up with an idea of building an IDE tightly liked with a new framework?
Well, you have a magic trio i.e. Angular, React and Vue (and many more others), however they seem to solve the exactly same problems. And, of course these are very valid and crucial dev problems. But somehow these frameworks don't feel enough. You still might f**k up many things and work around the framework and it doesn't even need to be intentional. You just simply pressured by deadlines, tired or the problem you solving leads you to step out of the framework guidelines. We thought - OK, if not a framework than what else? - Some sort of tools, maybe CLI? - Nah, that would be too complicated for beginners. Then, after months of thinking, we came up with an online IDE which lets you download maintainable code and walks you through dev experience. LOL - not ambitious at all! Ironically, when started on the IDE we realised we need a simpler and very generic framework.
That's enough of intro. Let's get our hands dirty! Go to: TodoMVC Demo
The IDE has a split screen. Left: HTML, right: CSS. There is no concept of files. All you have is:
- pages
- dependencies (JSON used for third-party imports)
- reusable slots (pieces of UI shared across your up)
- providers (actions executed prior rendering)
- commands (actions triggered by a user)
- 'implement...' drop-down (a list of things to be implemented, populated live as you change HTML)
- eye icon (live preview)
- create/remove page buttons
Navigating can be done by choosing stuff from the drop-downs. The IDE is intended to work in multi tabs (you might need to enable popups). We wanted developers to be able to work on multiple screens and arrange tabs as you wish.
If you get to known me better you'll notice that I hate repetition 😄 In the Demo I left comments explaining things in context, therefore I won't bombard you with tons of screenshots. The things you'll see there:
- how to change a page name
- how to executed providers prior rendering of the page
- how to change page title (no kidding - you can 😆)
- how to create a new page
- how to use reusable slots
- how to add conditionals in HTML
- how to modify HTML tags dynamically
- how to repeat HTML tags
- how to use conditionals in loops
- how to scope-style a page, its slots and reusable slots
- how to use third party libraries (See Dependencies and any command e.g. addTodo
The list isn't explicit. There is more stuff you can do and even more things you will be able to do. It just requires time and effort 💰.
Enjoy exploring and gimme your feedback!
More links:
Top comments (0)