The lack of template in b4x, could be its achilles heel?

Alejandro Moyano · Jun 7, 2021

Hi i ? B4X , but thinking about how we work I see some pattern.. as b4x community lack of templates:

For example, at work (where i backend dev), when must to do an app:

1) we get requirements, define the colors, modules and use cases, define kanban, etc
2) we go to themeforest an choose a beautiful template.
3) we do an compile on cordova (i know is a quite old school but most people unknow)
4) we compile as pwa

Next example, we must do an site:

1) we get requirements, define the colors, modules and use cases
2) we go to themeforest an choose a beautiful template based on bootstrap and laravel
3) we develop
4) deploy on shared or vps

What i see is as developer we always use templates for gui, most small teams do it as can't afford a full time designer.
Plus users wanna awesome interfaces, with animations, shadows, etc.

How we can get gui beating apps like framework7 or Bootstrap with same work?
I know its possible as some forum gui project are nice, but can't beat a 19 dollar template with 100 controls!

hatzisn · Jun 8, 2021

You may want to call @ramezaniabbas to the rescue.

Cableguy · Jun 8, 2021

Alejandro Moyano said:
as b4x community lack of templates:

It IS possible to create Template for B4X IDEs (see this post) but it seems that, if someone has created some, apart from EREL, no one is sharing...

Alejandro Moyano · Jun 9, 2021

Cableguy said:
It IS possible to create Template for B4X IDEs (see this post) but it seems that, if someone has created some, apart from EREL, no one is sharing...

What i means full templates with styles and premade pages like this:

Zak: Multi Purpose Mobile Web App template (PWA)

Zak: Multi Purpose Mobile Web App template is premium mobile Ui App. It is designed using Materiliaze Framework. It is modern responsive front-end framework based on Material Design. It is speciall...

themeforest.net

Affan - PWA Mobile HTML Template

The Affan is the latest technology-based multipurpose PWA-ready mobile HTML5 template. It comes with a Modern Design, vanilla JavaScript, Bootstrap 5, Progressive web app (PWA) ready, and Dark & RT...

themeforest.net

Most time u only need buy one and develop using their interface then u app looks beautiful besides u as dev have bad taste.
I would love to see an integrated store on this page where u can browser designs preview a video buy it and create the app on top of it, as we do on work.

TILogistic · Jun 10, 2021

Estimated,

I know what you mean by B4X templates.

I have developed a view or component framework B4X (similar to Bootstrap), which we use to create our projects or templates.

as in your example:

Affan - PWA Mobile HTML Template

designing-world.com

If you want you can contact me.

Regards.

LucaMs · Jun 10, 2021

oparra said:
If you want you can

... show us what it looks like

LucaMs · Jun 10, 2021

Alejandro Moyano said:
premade pages like this:

First link. I pressed "Preview Item" and this is the result:

that is, unlimited waiting.

Why? Because I'm using Firefox (PC); it works with Chrome.

Doesn't seem like a very good thing to me.

Hamied Abou Hulaikah · Jun 10, 2021

Easily you can do it with B4X ..
1) we get requirements, define the colors, modules and use cases, define kanban, etc
2) we go to themeforest an choose a beautiful template (html template).
3) we do an embedding html template in B4X webview
4) we compile as pwa (Progressive Web Application: HTML files with thier assets cached to web browser on first opening online then can be worked offline)
5) we compile as apk (android), api (iOS) or exe (Desktop)
DONE

see example created within 5 minutes using B4A webview ..

LucaMs · Jun 10, 2021

HAH said:
Easily you can do it with B4X ..

The question is different, using WebViews is not the solution (4. ???)

Having a method, templates to customize the appearance of the XUI Views, for example, which are common to the 3 platforms, would be useful/pleasant, but not easy.

Hamied Abou Hulaikah · Jun 10, 2021

@LucaMs I agree with you, but post creator search about fatest development approach with exist pwa template (i.e. themeforest repository)

LucaMs · Jun 10, 2021

HAH said:
@LucaMs I agree with you, but post creator search about fatest development approach with exist pwa template (i.e. themeforest repository)

I'm not sure (I don't think) he wants to use templates for the web.

Alejandro Moyano · Jun 10, 2021

HAH said:
Easily you can do it with B4X ..
1) we get requirements, define the colors, modules and use cases, define kanban, etc
2) we go to themeforest an choose a beautiful template (html template).
3) we do an embedding html template in B4X webview
4) we compile as pwa (Progressive Web Application: HTML files with thier assets cached to web browser on first opening online then can be worked offline)
5) we compile as apk (android), api (iOS) or exe (Desktop)
DONE

see example created within 5 minutes using B4A webview ..

Yes you could do, u can even use BANANO con Vuetify to avoid the pain of use JS.

LucaMs said:
I'm not sure (I don't think) he wants to use templates for the web.

Yes what I means is for professional use (apps to sell as freelancer or startup) the regular B4X UI lose against PWA frameworks with cheap templates like Framework7, and performance is not bad (but far for B4X performance)
For example if u go to https://framework7.io/ the design is a quite ugly, but u can buy an template with beautiful style, that saves hour and hours of design and let you focus on the app, with limited taste using those framework your app looks competitive.

I'm not saying that B4X could not have the potential, what I means is that the lack of ready made design may been a reason for drop the use of most professional scenarios where time is limited and are mostly CRUD based apps where performance is not so important.

Alejandro Moyano · Jun 10, 2021

LucaMs said:
The question is different, using WebViews is not the solution (4. ???)

Having a method, templates to customize the appearance of the XUI Views, for example, which are common to the 3 platforms, would be useful/pleasant, but not easy.

An performance on desktop will be a nigthmare as the javafx webview rendering is not good.

EnriqueGonzalez · Jun 14, 2021

Alejandro Moyano said:
How we can get gui beating apps like framework7 or Bootstrap with same work?

Hi Alejandro! i have sucessfully paired Boostrap templates (any template actually, it doesnt need to be a jquery based template) with B4J, i was inspired with other languages and web frameworks so i created a framework of mine based on the Server Side Rendering technique (a la Rails and Django).

Currently i am trying to implement Tailwind CSS, its just a matter of time before i do it!

My dream is to pair this framework with an ORM based model because as of now i use raw sql queries.

Alejandro Moyano · Jun 14, 2021

Enrique Gonzalez R said:
Hi Alejandro! i have sucessfully paired Boostrap templates (any template actually, it doesnt need to be a jquery based template) with B4J, i was inspired with other languages and web frameworks so i created a framework of mine based on the Server Side Rendering technique (a la Rails and Django).

Currently i am trying to implement Tailwind CSS, its just a matter of time before i do it!

My dream is to pair this framework with an ORM based model because as of now i use raw sql queries.

Yes but my main idea was the trouble of get competitive native UI on B4X without have a designer, something that u can address in another hybrid frameworks trough templates.

Another topic are server side pages!

That CSS framework seems great. Do u server side rendering use jinga2 style?

EnriqueGonzalez · Jun 14, 2021

Alejandro Moyano said:
Yes but my main idea was the trouble of get competitive native UI on B4X

Sorry when i saw you wrote Bootstrap i thought you meant web development.
I couldnt say much about webview apps, i wouldnt use anything related to cordova but there are other approaches that does better like the Hotwire approach.

Alejandro Moyano said:
Do u server side rendering use jinga2 style?

yes thats correct!

it looks like this:

B4X:

Dim root As Map
        root.Initialize
        root.Put("name",req.GetSession.GetAttribute("name"))
        root.Put("id",id)
   
        If id = "0" Then
            root.Put("verbo","Crear")
        Else
            root.Put("verbo","Modificar")
        End If
   
        Dim recurrente As Map = getRecurrente(req,id)
        utils.JavaMapMerge(root,recurrente)
   
        Dim t As Template = Main.templates.getTemplate("recurrente.html")
        resp.CharacterEncoding = "utf-8"
        resp.Write(t.stdOut(root))

each key of the root map is a variable i can use in the templates, it supports complex types like list and maps.

and the template looks:

as you can see i recycle the views calling them from their own files.

Anyway, Allain (abmaterial creator) saw the same problem as you and created his own designer, it is about on how much you love the language and how much time you are willing to invest.

The lack of template in b4x, could be its achilles heel?

Alejandro Moyano

Member

hatzisn

Expert

Cableguy

Expert

Alejandro Moyano

Member

Zak: Multi Purpose Mobile Web App template (PWA)

Affan - PWA Mobile HTML Template

TILogistic

Expert

Affan - PWA Mobile HTML Template

LucaMs

Expert

LucaMs

Expert

Hamied Abou Hulaikah

Well-Known Member

Attachments

LucaMs

Expert

Hamied Abou Hulaikah

Well-Known Member

LucaMs

Expert

Alejandro Moyano

Member

Alejandro Moyano

Member

EnriqueGonzalez

Well-Known Member

Alejandro Moyano

Member

EnriqueGonzalez

Well-Known Member

The lack of template in b4x, could be its achilles heel?

Member

Expert

Expert

Member

Expert

Expert

Expert

Well-Known Member

Attachments

Expert

Well-Known Member

Expert

Member

Member

Well-Known Member

Member

Well-Known Member

Privacy & Transparency

Privacy & Transparency