Zandra, Author at studio zandra

Mozilla’s NSS package on Windows 10 (when Chocolatey fails you)

I recently needed certificate handling for some CraftCMS development. Using Chocolatey, I tried installing mkcert and nss (Network Security Services) but got the following error:

nss not installed. The package was not found with the source(s) listed. Source(s): 'https://chocolatey.org/api/v2/'

(Yes, I have still not fully switched back to 🐧Linux yet! Getting there, but I am still using Teams breakout rooms — not available on Linux — and Outlook for my teaching gig, until that ends in a few months.)

So you want to support Firefox, even though Firefox doesn’t support you, o Windows developer?

Yes, let’s be the ‘bigger man’! LOL

Heavily adapted version of Johann ‘Myrkraverk’ Oskarsson’s handy blog post follows, with just a bit of updating for 2024.

It’s gonna require a LOT of steps, including installing Visual Studio Installer and Python, in case you don’t already have it installed — you’ll need Python to install a package called gyp-next :

python3 -m pip install gyp-next

Next you’ll need to download the NSS package manually from Mozilla:

I also used 7-zip in the terminal to extract the package (you’ll need to extract the .gz file, then extract the resulting .tar ball once more). Your filename will be different depending on the newer version you may download:

7z x nss-3.101.1-with-nspr-4.35.tar.gz ... 7z x nss-3.101.1-with-nspr-4.35.tar

Now you can go into the Visual Studio Installer graphical application. Click the Launch button:

This will launch a new type of terminal inside that app, like this:

Now you can cd into

cd C:\mozilla-build\msys2

Then enter the command:

msys2_shell

ANOTHER shell will pop open (keep the old window open) — enter your SSH password (nothing will appear at the prompt as usual) then hit Enter. It should say, “Identity added” to your local hosts.

Almost there. Now return to the terminal window which was launched by Visual Studio Installer (the one we kept open). CD into the extracted directory for NSS ( cd nss\nss-3.101.1 or whatever folder you created for it). Make sure you further cd into ‘nss’.

Lastly, run

build.sh

Now if you back out one level, you will see you have a new folder called ‘dist’. I don’t think you actually need this folder when just developing frontend applications, but let’s see! UPDATE: no, I have not needed it and it’s been 2 months. 😉

Fun with Streamlit apps and LM Studio

Taking a fun course with Lonely Octopus, I’ve been learning how to use pandas to clean data for analysis, and also how to quickly build a proof of concept/MVP using Streamlit.

Installing Streamlit locally on Windows in Gitbash threw an error:

$ pip install streamlit

WARNING: Failed to write executable - trying to use .deleteme logic ERROR: Could not install packages due to an OSError: [WinError 2] The system cannot find the file specified: 'C:\Python311\Scripts\watn311\Scripts\watchmedo.exe.deleteme'

“Watchmedo”? Sounded like malware. I got scared and shut off my wifi for a sec. Then I calmed down and decided to run it in a venv instead. Created the venv:

$ python -m venv myenv

Then activate it (I’m using Gitbash for my shell):

$ source myenv/Scripts/activate (or source myenv/bin/activate)

Then try again to install Streamlit and check if it installed properly:

$ pip install streamlit

$ streamlit --version Streamlit, version 1.36.0

Now the moment of truth — run the little app:

$ streamlit run app.py

You can now view your Streamlit app in your browser.

Local URL: http://localhost:8501

It might also require installing OpenAI, so don’t forget to do that, too. BUT…

Running LM Studio is something I’m getting a lot more used to now. I’ve been playing with it and AnythingLLM for local document RAG chats.

So you don’t need to call OpenAI’s API — you can point your app at your local LM Studio server!

You have to grab the example code from inside LM Studio under “chat (python)”:

client = OpenAI(base_url="http://localhost:1234/v1", api_key="lm-studio")

Paste that into your Streamlit app.py file, replacing the ‘client’ variable. Make sure the model is loaded up, and that the server is running.

There are tons of settings to consider inside LM Studio. You also need to have enough memory to run the models! LM Studio’s Discord server is a good place to learn more.

JobsTrek app – new dashboard and styling

A big issue with my job tracking app for jobseekers was the terrible colors. “Just build an MVP, don’t worry about aesthetics,” was the vibe that led me to the weird green background color.

But that’s gone, now that a slick new ‘skin’ has been applied — the Argon dashboard for Django, an open-source package.

There are still a lot of other issues to be fixed, but that was a very pressing one which I think adds some momentum.

The Argon dashboard is installable via pip, so it’s easy to integrate. I wish I had used it from the beginning, because it kinda took over my routing — it assumes you want to use its login page (it has a password reset link and other bells and whistles which I’m not quite ready for yet). A few adjustments to urls.py and it was fixed.

It also comes with a lot of icons that I don’t need and will have to tweak. Overall it’s quite a robust package. If and when I get more users, I’ll pay for the commercial license, where there is also a bit of support via Discord.

Next is mapping the data points on the line graph correctly!

Career coaching and the dev job hunt

I’ve been giving free resume reviews on a couple of Discords for a few months now. Seeing some patterns appear — people are bemoaning the ghosting and the fake job posts, but still using the same approach and blaming their resumes.

So I made a video on the importance of and how to follow up after applying, with a human!

How to contact a company after applying for a job – DMs and emails

how to contact a human at the company after applying

This is one thing I wish I would have learned earlier in my own career. We spent so much time “pounding the pavement” years ago, only to be told by some receptionist to “go to the website” in order to apply. We were trained to apply online, apply online, apply online. And just sit back and wait for the response!

In this video I explain how to actually follow up with a company once you’ve applied.

Side project, JobsTrek, YouTube channel

Oh yes, I am officially a YouTuber (cue fanfare.wav). In case you missed it: here’s a video walkthrough of the JobsTrek app. (Discussion of the code starts here.) I was a bit sleepy when I made this one, so let’s just says it’s not exactly electrifying YouTube. But I did enjoy making it! Someday I’ll invest in a proper video editor and make some cuts to these videos.

simple demo of the JobsTrekker Django app

It’s possible that I’ll relaunch once I’ve added an expanded dashboard. I had also started adding a chatbot using the Crisp.ai app integration, so I may again get to work with the OpenAI API…stay tuned.

Working with the Nucamp grads and prospective students again is also rewarding — they are a good group of folks trying to better their lives for their families, and seeing them help one another in the community is awesome.

Deciding whether to go further with the YouTube channel, I was able to host another couple of career workshop sessions for some job training clients from Goodwill NYNJ this month. It’s great to be able to offer my skills and just share my experience with what not to do!

Trying out Ignite with a new Android project

Because I have some free time this evening (wow!) I thought I’d burrito-ify myself in front of the computer and finally make a photo viewer Android app for myself.

Let me back up a bit — since LG stopped making phones, I was forced to get a Motorola phone recently. It’s nice and all, but it doesn’t come with a photo viewer. Which means one must use all the Google apps (file viewer, Photos app, etc) to access one’s files.

This is no bueno.

So naturally I have simply not been opening my files on my phone. Unless someone has sent it to me via SMS or Discord or what have you, where I can view a preview. Or, if I upload it to my Proton storage, I’ll see a preview. (Even VLC Media Player seems to have failed me here — it doesn’t open 95% of the video files I task it with opening, for some reason.)

I got started with a video appropriately titled, “Getting Started With Ignite,” by Jamon Holmgren of Infinite Red. (https://www.youtube.com/watch?v=KOSvDlFyg20)

Install Yarn first if you want to follow this video smoothly (it can be installed via npm).

Deciding to upgrade to Node 20.8 to keep pace with the video, I downloaded the msi file from the official Node site, and double-clicked it — I didn’t have any reason not to install it globally on this machine. The usual “Get apps from Store / Install anyway” Microsoft warning appeared, but it had scroll bars; weird.

I clicked “Install anyway” several times — nothing happened. Did a dreaded restart. Same thing. So I had to run it from inside PowerShell:

msiexec /i “node-v20.8.0-x64.msi”

Quite irritating, but I thought it was just a fluke/bug.
Next was npx ignite-cli@next new PhotoView

… and selected all the desired settings. I chose all the defaults. I enjoyed the lovely ‘splash screen’:

When I got to ‘yarn android’, the error, ‘Failed to resolve the Android SDK path’ appeared. I remembered that I’d never installed Android studio on this particular computer. Downloading from the official Android homepage, I again ran into the same Windows bug. This time the exe file would not run in PowerShell. My hubby suggested running the Compatibility troubleshooter, which worked, but it seems that the bug can also be bypassed by turning off that warning in the OS settings under Apps & Features > Choose Where to Get Apps.

However, now I’m getting, “Starting Metro Bundler
CommandError: No Android connected device found, and no emulators could be started automatically.”

Yay, new error message!
But I’m ready for bed now… to be continued.
Ok, just kidding…I surfed around Twitter (Xitter?) for a bit, then got my second wind.

Starting Android Studio, then going into Device Manager and clicking the play button to start the device…

…seems to have worked:

Now to attempt some modifications so I can gradually get a photo viewer… to be continued…

From jQuery to JavaScript Without Tears

Un-possible?

Looking for a cute set of progress bars for my app, I searched around and found a great blog post with a few examples. Originally I had zero intention of using animated progress bars, but they seemed to fit well enough for my needs and actually added a bit of, dare I say, pizazz, to the page.

So I go to play around with the code… aaand it’s jQuery.

On a positive note, usually I can tell what’s going on in jQuery, as if reading psuedocode. It feels sort of like guessing what a Spanish billboard says as an English speaker (to me, anyway). I suppose the faster way to move forward with my project would have been to just import some jQuery via CDN, but I decided that I wanted to fully understand what was going on, and thus decided to rewrite it in plain JavaScript.

“Mayhaps, in the span since first we met, an AI hath vanquished thee, mighty jQuery,” I said to my screen as I Googled “jQuery to JavaScript converter.”

Surprisingly, there was a tool which actually did something, or enough to get me started. Despite some very strange copy on their page, the WorkVersatile converter did deliver on their promise of only “some errors” after conversion.

The original jQuery:

$(".animated-progress span").each(function () { $(this).animate( { width: $(this).attr("data-progress") + "%", }, 1000 ); $(this).text($(this).attr("data-progress") + "%"); });

… and the invalid JavaScript output:

document.querySelectorAll(".animated-progress span").each(function () { this.animate( { width: this.attr("data-progress") + "%", }, 1000 ); this.innerText = this.attr("data-progress" + "%"); });

My end product; instead of innerText, I used the Django template to fill in the element’s text:

document.querySelectorAll(".animated-progress span").forEach(ele => { 
  
  ele.animate(
  [
    { width: ele.getAttribute("data-progress") + "%", },
  ], 
    {
      duration: 1000,
      fill: "forwards"
    }
  );

});

Using Pivotal Tracker to Manage Your Project

Pivotal‘s free tier might be just what you need to get started or re-energize your side project.

Combining Pivotal’s project management software with pomofocus.io — those two tabs in my browser have really boosted my output and kept me organized. So far, the free tier of Pivotal Tracker has been enough to get my little project off the ground, so I thought it might be helpful to share.

You create an account and then name your project. Then you can add user stories or features which you eventually plan on adding to your app or site (your product roadmap).

Adding these features is pretty simple, and you can put as much detail as you like.

Pivotal Tracker project dashboard screenshot — The Pivotal dashboard shows you an estimated project schedule, status, and backlog

Working solo, some of the features like “Accept”/”Reject” buttons aren’t really useful (think: pull request meme of awarding oneself a medal). Also, I’m not quite clear on the project velocity calculation, which seems like a powerful feature that I’m not taking full advantage of at the moment (here’s a 2-year-old video explaining the velocity calc feature, or you can actually — shudder — read the docs). Other than that it’s pretty amazing for my needs. And it’s nice to know that I can still have up to 5 users should I need to bring on help.

This sort of freemium app is really enabling a lot of startup and small business innovation, since a lot of side projects don’t generate income at first. I hope to pass it along with a freemium app of my own!

Testing in Django, or “How long has that been broken?”

When the phrase, “how long has that been broken?” enters into your vocabulary, it’s probably past time to add tests to your project.

Finally got my tests going with some momentum. I’ve also adjusted the dashboard view a bit over at JobTrek; although I’m lacking time to design a UI, at least it looks a bit better now. (Leave a comment if you think I shouldn’t wait to find another Bootstrap theme.) And dear Lord help me, I’ve bought a domain name and even coughed up the $7 for the Heroku Hobby plan with SSL.

I’d learned some basics in the Kickstart Coding course, but couldn’t get my basic tests to pass. Turns out I’d been adding my tests to the wrong tests.py file, in the wrong app directory. Hopefully this blog post will save some random person out there from making the same mistake!

Another beginner issue for me was testing templates and content for anonymous versus authenticated users — more on that in my next post.

For some good, free content on testing in Django, check out VeryAcademy’s series on YouTube.

The J.O.B. search continues — is there an app for that?

The fun-employed phase has lost its luster; I’m not quite at the soy-sauce-over-rice-for-dinner stage, but let’s just say it’s crunch time. Now firing off apps left and right, sending LinkedIn DMs, and contacting recruiters and former co-workers is the daily grind.

In side project news, I’ve abandoned SelfWars and all those Vuetify components. Also, I’m finally digging in to SQL joins (studying via Kickstart Coding,) after avoiding it like the plague for so long.

Lately been building a job search progress bar web app in Django. Fun, fun, fun! Wanna take a sneak peek?

“Your search will take approximately 8 weeks”

Step 1: register — I know, I know (a user story for anonymous sessions is on my plate)

Step 2: add some jobs you’ve applied to, using the simple form

Step 3: view your interview rate percentage and offer rate percentages on a handy pie chart (more graphs are planned)

See if your interview rate is around at least 15%, and see approximately how long your search will take. Based on lovely research from TalentWorks.

I know I said ‘progress bar,’ but for now it’s in the form of a pie chart; hey, who dun’ like pie?

I realized I was giving all this ‘daily grind’ advice out to Nucamp students, but when folks see in starkly-presented numbers just how long their job search could take at a certain pace, I think it’s got the potential to be an illuminating kick in the pants.