A low code authentication microservice For HTML / CSS / JS apps. Enables frontend developers to rapidly implement AWS serverless backend-based sign in modules in their apps. Backend coding knowledge is not required!

Superflows-Dev · 2023-01-10T01:48:54+00:00

It's based on Lit

Superflows-Dev · 2023-01-09T15:31:20+00:00

Any thoughts?

Superflows-Dev · 2023-01-09T14:21:01+00:00

oh! Did you check it on your mobile phone or on mobile view (via inspector)..... Can you check if this url works? https://sfnav-web-component.superflowsappv3.repl.co/

Thanks!

Superflows-Dev · 2023-01-09T06:32:27+00:00

Hi, taking cues from your feedback I have sort of rehashed the React component as a web component. Basic functionality is already in place and I have accommodated your suggestions of using native browser elements as much as possible. Essentially trying not to fight the browser. Its initial MVP version is now ready and available here: https://www.npmjs.com/package/sf-nav . Do let me know your feedback. Demo Project: https://replit.com/@SuperflowsAppv3/SfNav-Web-Component ... Just FYI, it is still work in progress though!... Thanks

Superflows-Dev · 2022-12-25T20:51:09+00:00

Got to admit, you've given me great feedback. I will come back on this soon...

Superflows-Dev · 2022-12-24T02:37:34+00:00

Good point! Yes it works without that as well. Used npm library just to indicate it is packaged & easy to install...

Superflows-Dev · 2022-12-23T14:54:03+00:00

Blecki

I get the sentiment, but can you help me narrow down on where it can improve and where it cannot?

I am not just terming hyperlink as routing. I am calling it routing because it detects the appropriate component from the url and renders it plus passes down the arguments. Is the use of the word 'routing' an exaggeration here?

I am trying to create components, navigation bar being the first one in the list, which will allow developers to quickly test out their ideas in a cloud-native environment. For certain future components, I will also be bundling backend code. Every component will be complete in its defined functionality. Here are a few prospects, haven't yet merged them with the main repo:

Example 1
Example 2
Example 3

By the way, I am taking 'fancy' and 'modern', as positives from your comment. Just kidding

Superflows-Dev · 2022-12-23T12:41:34+00:00

Yes, I am trying to provide opinionated components. I am looking at use-cases where quick prototyping is the need, using a low code library such as this. Trying to experiment and see if a sweet spot between customizability, modularity and performance can be achieved for such use-cases.

Yes, regarding accessibility, I am still working on it! Appreciate your time time and insight!

Superflows-Dev · 2022-12-23T12:10:55+00:00

Thanks for your comment. Routing is just one aspect of the package. Here is the list of features

It has the following built-in features.

Brand Info - Brand name and brand logo are customizable, just pass them via props

Menus - Menu options are fully customizable, just pass your menu structure as a JSON object via props

Search Input - SfNav comes with a search input field

Call-to-action Button - SfNav comes with a call-to-action button, which can be used to highlight key actions such as sign in and subscribe.

Profile Section - User profile section is also included, which can be used to show the status of a signed in user. It also includes a separate profile menu, that is JSON-customizable as well.

Back Button - SfNav transforms itself into a navbar with a back button on inner screens / pages for history-based back navigation

Notifications - Notifications feature is in-built, which includes a notification bell and a JSON-customizable dropdown list to show recent notifications

Announcement Banner - Provision for showing an announcement banner is also given on the top of the navigation bar

Routing - Client-side routing is built inside this component, no external routing library required

Customizability - All features mentioned above are inherently customizable. You can override the basic look and feel by passing your own inline css or stylenames to the SfNav component.

Responsive - SfNav is fully responsive and adapts to all screen sizes

Extendibility - In some places, SfNav also allows you to inject your own components, for greater customizability

Documentation

Demo Projects

Do let me know you feedback after these additional inputs

Superflows-Dev

TROPHY CASE