🎨 WDC #10 Can you re-create Randall's password generator?

Happy Monday everyone - just wanted to share what I managed to get built, using the “Vaulty” design for inspiration.

https://x.thunkable.com/projectPage/607448e1730d210011663929

(oh, the PIN is 4242)

I started off by getting the functionality that I wanted. I knew that all the components would need to be restyled so at this stage I was just focused on where they were positioned.

I chose to place the button and the slider towards the bottom of the screen for ease of use, with the switches further up the screen as my feeling here was that they’d be used less often.


After that I wanted to get an image with a gradient for the button background. This was the second result that came up when I Googled “Gradient Generator”. It looks great and more importantly it allowed me to download a .jpg image so that’s what I went for.

Being able to see the screens side by side was really helpful. I opted to place the “Continue” button and the “Generate” button at the same height on the screen for a more consistent experience.

It’s not 100% perfect, but I managed to get the password generator working in 99 blocks! :grinning_face_with_smiling_eyes:

Take a look at my project page if you want to have a closer look at the blocks or to remix the design,
thanks: https://x.thunkable.com/projectPage/607448e1730d210011663929

4 Likes

Yes I got the value but I am getting a error message I Will share the message tomorrow gotta go to school

1 Like

Really nice, @domhnallohanlon! I did notice that the first time I generate a password, it defaults to a length of 4 even though the slider shows 8. As soon as I change the slider value, it works properly.

1 Like

How did you add a switch component? I don’t have that in the drag-and-drop interface.

I also don’t have an option to remix your project. Did that feature get moved?

Edit: I guess I just needed to duplicate the project. I kind of liked the old “remix” button.

When I open your project, I can edit the switch components but I don’t see a way to add a new switch:

worked like a charm! i know i tried the same approach before but never tested in on the device, only on preview! thanks for the tip!

1 Like

I thought this would be spotted last week so I used my non-staff account to create my project with the Dark Mode switch…I was certain that this was available to everyone. Maybe I have some other setting enabled to give myself access to the Switch?

Well, the switch component will be released soon - keep an eye on #announcements for the official release!

3 Likes

i was aiming for functionality of https://correcthorsebatterystaple.net/ so i knew there was going to be random selector from a list of words so my first item to search for was a dictionary. i found one at github in the form of a word list, but after anticipating inefficiencies due to storage and lookup performance, i decided to look for an API that returns random words instead!
i found this link that generates 50+ random words per call
https://www.wordgenerator.net/application/p.php?id=nouns&type=1&spaceflag=false

but i kept getting network errors (that @muneer just recently resolved - thank you!) so i opted for another api which could return a noun, an adjective or an animal. so i simply make random calls to these options and stop when i’m over the minimum word count and the minimum phrase length. if verbs had been available the generated pass phrases would have been memorable (and/or funny) because there is action involved.

i forgot about the switch component - that’s why i was using sliders for my toggles! haha!

2 Likes

How do you view your passwords? There is no way to do that @codeemaker !

I have a drawer navigator

1 Like

Oh, OK. Please do give some sign to the users that they can swipe, such as a hamburger.

Wow! Great job everyone, not just this week but for all your efforts in the recent challenges showcasing the capabilities Thunkable.

Thanks @domhnallohanlon for nominating me - my entry is based on the passphrase generator you shared.

The icons are from icons8 and random words are from this API: Random word API

If you want to add to this app here’s the remix link:
https://x.thunkable.com/projectPage/60756b6da5f31700120fb495

Keep the great designs coming and keep the feedback coming too - so impressive to see what can be built in just a weekend with Thunkable

5 Likes

Thanks @arun

I know I’m a bit late but here is my submission -

  1. It creates a password with specific options like symbols, length, numbers.
  2. You can also save your passwords.
  3. All with a good UI

Project URL - Thunkable
Web Test - Thunkable

3 Likes

i know i already posted my app but actually i updated a lot and here is my new project -
how is this -





project link - Thunkable
Update : added copy button, option to generate password, option to check password strength, option to manage passwords
blocks - 546
web test - thunkablecompanion

2 Likes

@luv.ak.tech is your copy button working? Mine was not working on android so I removed it

1 Like

it only works in browser i removed it recheck my project i found a way to let users copy

good ui

actually it is Password Generator , Checker and Manager

2 Likes

Congrats @domhnallohanlon for achieving the pass word generator in 99 blocks which took me 400+ blocks.
But, sometimes if I enable all the buttons the result doesn’t comes as desired -


Here the symbols button is enabled but no symbol is there

2 Likes

16 posts were split to a new topic: Question about using the slider value