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.

facepalm, the other Picard maneuver

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.

Jamrock, and updates

Just back from wonderful travel visiting relatives around Jamaica. It was much-needed refreshment, and my first international trip since Sweden, back in the ‘before times’.

obligatory beach image

It was great to spend a lot of time with family. I specifically went to see my aged grandma, who is in her 90s but is still sharp as a tack and still going up and down staircases — bodes well for the ‘ol genome. When I complained about carrying some extra pounds, she chided me that I could use a few trips up and down some steps as well. The Greatest Generation rolls like that!

My intrepid hubby rented a car and drove around the island. Everyone, including me, was pretty impressed with his skills — next time I will definitely fly into Montego Bay instead of Kingston, and rent a car.

Perhaps Portland, Jamaica’s potholed roads are a good metaphor for a coding career.

gif of car interior with view of bumpy road
the country roads are finally being repaved, but in the meantime…

(They are making improvements, but in the meantime here is a hilarious commentary on the lack of repair.) Driving those roads certainly make one question one’s life choices. But then there is a smooth stretch of pavement for a while, and all the struggle and perseverance seems worth it.

I made the really tough decision to leave the role I posted about. The company was great, the people were amazing, the kudos on my progress were good; even React was not as annoying as I’d remembered. It was just one of those weird miscommunications of expectations which sometimes happens, especially when both sides are well-intentioned and perhaps a bit starry-eyed. Once we realized what had occurred, there was some extra work involved for everyone — I personally was pulling unsustainable hours to keep up. Could I have rode out the tough schedule for a year? Likely at the cost of some health and home life, sure. But I think both sides also learned a lot for the better, and ripping off the band-aid salvaged some time and money for all concerned.

Knowing that I can do the job, ‘drinking from the firehose’ of web development and seeing leaps of improvement, is very validating.

So I’m again at a small fork in the road — should I forge ahead with another dev role, or should I take what I’ve learned and revisit the customer support/management-y realm. Before the Jamaica trip I was experiencing a lot of angst about it, but I’ve been reminded that a lot of people dream to have such decisions before them! My gut says to apply for both tracks and see what turns up. I think I shall sleep on it.

Closing one chapter and starting a new one

My “Drafts” folder has more blog posts in it than one might think. But I surely had to post this one.

It’s been a minute since my last post, and what do you know: we are back in NYC. And it almost feels like we never left — nobody asks me, “you military?” or “how long you been here” in town. Everyone is from someplace else, and they have pretty tasty poke here, too.

I got a wonderful job offer with a new company, which, exciting as it is, means leaving the great team at Nucamp. I’ve been there for a couple of years, first as a Web Fundamentals Instructor, then as a Student Advisor and Advisor Team Lead.

teaching a lovely group the Web Fundamentals in early 2020

The Nucamp team is helpful, funny, and kind, so I’ll really miss them, and hopefully I can check in via Slack when I have time. It’s really something very special that’s being built there, but I am leaving to pursue…a software engineer role!

Finally I’ve been blessed with this opportunity, after doing freelancing and teaching. It’s humbling to be reminded so sharply of all the “good gift[s]” and “perfect present[s] from above, coming down from the Father of the celestial lights.” It’s also a bit scary, but good-scary, like climbing a roller coaster. And that’s where the growth always seems to occur — in the scary bits. I’ll post more as the weeks and months go by, but as a friend of mine often says, big tings a gwan

SelfWars app, pt 2 — rough wireframe

I had to decide what features to put in a basic version of the app.

rough sketch of the app screen

Russell Brand mentioned in his video that he used a scale of 1 – 10 to rate himself in each life area. I decided to start with 1-5 for now and sketched out a rough list of ideas:

Default scale of 1-5, maybe this scale is editable by user later?
Default set of life areas, can be renamed by user later
Be able to save progress and view a bar chart for week/month
How did I do this week? frequency? daily/weekly?
Need an initial default setup after first open of the app, so that there’s some baseline to compare to

I was going to also set different domains or life areas, but maybe that will be v 2.0:


Good spouse – family
Diet – health
Exercise – health
Bedtime – health
Spiritual practice – spirituality

Some sort of “save” button or option, perhaps

“View past” – a way to view a chart over time

Next, to start building, which I’ve already begun, using Vue.

SelfWars: A New App

An idea for an app to evaluate myself on a daily basis came to me recently while watching an odd video. (I was a bit bashful about setting this post to public last year, so it’s a bit old now. I might be motivated to revisit this project by blogging.)

It was Russel Brand discussing procrastination on YouTube. (Oh, the irony.)

The user would set the parameters on different scales — how Zandra-y was I on exercise this week on a scale of 1 to 10? Maximum Zandra? 40-year-old, years-ago-Zandra? Or ace Starfleet cadet Zandra level? Was I the best Zandra that I could be today/this week?

I think SelfWars is a good name because it’s a constant battle against one’s self.

So if I drew a few prototype screens, what might they look like? Let’s see in my next post.

Downshift: Transitioning and the Career Twisties

My online presence currently projects as a Web Developer, and my current resume still rings more communications- and marketing-heavy. Really though, I am more of a learner, trying to find learning opportunities which will also pay my bills. But transitioning for the career-changer is not for the faint of heart.

Why did I feel the need to make a change? Upon moving with my husband’s job to Hawaii, I found the Hawaii job market to be very tough. There was nothing approaching my previous salary in New York. And it turns out, getting a good job in Hawaii is very, very much based on having friends in the right places. I made a new friend who gave me local cleaning jobs, and I also did a few temp gigs.

Reasoning that companies in other states would have more openings, I began searching remote job boards. I discovered that the higher-paying remote job listings were for developers, and I found out my dad had also been studying Python and other languages when he passed away, so that sealed my decision to study programming. But I had no idea what to study and actually started out with Python.

After a year of stops and starts (not to mention life drama, as it is wont to do, happening,) I realized I should have been focused on web dev! Yet another 6 months later, I realized that I might have benefited most from the regimentation of a bootcamp. I seriously considered attending a bootcamp out of state, but that would mean leaving home and my husband for months, and I learned that even bootcamp grads have to leave Hawaii to find entry-level work.

Just as the talent saturation of the Bay Area was a big factor in protracting  Patrick Thompson’s (YouTube) job search, the Honolulu area suffers from the opposite: many tourism-related jobs, but not many tech companies featuring entry-level opportunities. Transitioning for the career-changer after a certain age also adds an extra layer of difficulty, since there is competition with shiny new grads for the few positions that are available.

Acceptance and Failing Forward

Still doing the cleaning jobs, and I have a couple of job applications in review. If they get rejected I might wrap up my efforts to enter the web dev employment track. I am proud of all that I’ve learned, but basically I wasted 2 whole years trying to get a remote, entry-level web dev job — something that is still pretty rare! But failure can help you find different approaches and is good for your brain! I am viewing this not as a total fail, but as extremely valuable experience.

For example, I attended meetups and enjoyed working with some great people on a fun internship. Meeting a lot of kind folks in the Twittersphere has also been an unexpected bonus. I learned some essential tools, and learned what I didn’t want to work on!

Also, WordPress freelancing was supposed to be a stop-gap measure until I found a permanent job, but I have learned more about WordPress over the past year than in the previous 5 years as a mere user. I might attempt to go the freelance route. This is something I might not have considered a few years ago.

Lastly, I’ve had a lot of fun — many nights I have had to tear myself away from VS Code and go to bed! I even started a side project which might eventually earn some ad and affiliate revenue. A lot of developers will tell you that they don’t code 24/7, but rather have hobbies such as cooking or sports. So it seems natural that I can have coding as a hobby.

Hindsight Which Might Help Other Career-Changers

In hindsight, transitioning as a career-changer was not even something I could have attempted without the support of my husband. Not knowing what I was getting myself into was probably for the best! If I could go back in time and get a do-over, I would try to secure a remote job with a New York company before leaving New York and relocating to Hawaii. New York has such a diversified economy compared to Hawaii, and there are just way more opportunities available. Also, there seems to be an unfortunate perception of Hawaii residents as beach bums who don’t work, not to mention many mainland companies don’t want to complicate their payroll by hiring out-of-state.

Another thing I could have done differently is studying for the jobs where there is demand, not just studying whatever is interesting. I found Python to be a lot more accessible than JavaScript as a newbie, so that’s what I gravitated towards. Nothing wrong with that, if I had also learned Django. I played with Android Studio (Java) because I wanted to try making a mobile app. I took pre-courses for Lambda School (JS) and AppAcademy (Ruby), instead of just working on my own learning projects. Jumping around so much exploring different technologies, it took me much longer to gain enough skill in one language to pass a coding challenge. There is a confusing amount of stuff out there to learn and without a guide — it is tough to know what to focus on. So I’d say just pick a track/stack and start checking the subjects off one by one.

Which brings me to the final hindsight which I hope someone out there may find useful; having someone to guide you. I really didn’t know exactly what I wanted to do; I just thought I might be good at coding since I like solving problems. Looking at a job board, I had no idea what the difference was between a Web Developer, a Front End Engineer, and a Full-Stack Developer. And I was actually interested primarily in software development and machine learning at first. Having a knowledgeable person to talk to about these tracks might have helped me narrow things down sooner and save a lot of time and energy.

I still have a few job applications out there under consideration, so I will update again later…

Chatbots: Overcoming Errors Using the Rasa NLU Starter Pack in Windows

So I got invited to join a team building a chatbot, exciting! When I am able to say more I’ll definately post. I decided to do a bunch of reading and research in my free time. Ironically it was machine learning which originally attracted me to Python and coding a couple of years ago, and I’d given up on that due to employment options in my area.

I looked into a few options and it seems the best choice for keeping your data to yourself and not using external APIs is an open-source package called Rasa. They have a starter pack you can play with. It comes with a nice video guide, but this is running on Linux. I came across a lot of errors during the install process; hopefully this post will help someone else using Windows.

If you already have Python installed (whether by PyCharm or Anaconda or some other bundle,) open a terminal/command line (cmd.exe) and check to see what version you have by typing:

$ python --version

(Only type everything after the $, at the command prompt.)

You might want to also search for any instance of ‘python.exe’ on your PC.

‘python’ is not recognized as an internal or external command / Can’t find python.exe install folder

When you see “‘python’ is not recognized as an internal or external command” in the terminal, but you know for a fact that you have Python installed (perhaps, um, several different versions in several places,) you might think you are an idiot. But you’re not!

WHY IS THIS THE DEFAULT INSTALL PATH FOR PYTHON ON WINDOWS? WHY APPDATA. WHHYHKLJASLJKHJHKLASDHJKDSAKLadj,sfgjklmbn,dasfkl USE PROGRAM FILES pic.twitter.com/CvtrE2hXBF— CrashBash-Kun (@CrashBash000) July 2, 2017

(frustrated user tweet)

After some web searching, I tried setting the Python path in Advanced System Settings>Environment Variables. But that default install directory was too deep (ideally we want it in a top-level folder,) and it is a hidden system folder to boot, so I was really wondering where it installed to.

The easiest way to fix that is to reinstall Python using the graphical installer. Run the installer as administrator. BE SURE to click the little ‘Add to PATH’ checkbox, or all this will be for naught!! This is a lot quicker than manually adjusting the path in environment variables.
Then choose “Custom install location.” Clicking “Install for all users” should automatically change the install path to the C:Program Files folder.

You may also be able to do this without a full reinstall by selecting Modify/Repair under Control Panel>Programs and Features.

‘$ pip install spacy’ command finishes with murmurhash…MS Visual 14.0 C++ required

Rasa can use spaCy, Tensorflow, or other tool packages to parse text. For some reason, Rasa on Windows requires MS Visual Studio Build Tools. I’m sure there’s a fascinating reason behind this, but for now we just have to accept it. Their user forum and Github page has addressed the issue, and you can download and install the needed bits here. (The link provided in the error message — http://landinghub.visualstudio.com/visual-cpp-build-tools — doesn’t work anymore.)

“access denied” error returned in cmd

Retry the command, but this time run cmd.exe as Administrator (Start menu, type ‘cmd’, right-click the icon and select ‘Run as Administrator.’) I forgot to do this more than a few times.

error: could not find version that satisfies requirement Tensorflow

Turned out I had Python 32-bit installed (issue raised on GitHub here). I uninstalled it via the Programs and Features dialog and installed Python 3.6.8, 64-bit version. I also installed Anaconda because after all the errors, I was getting frustrated with the whole install and just threw the kitchen sink at it. Honestly I’m not quite sure which fixed this error! If I figure it out I will update.

How do you run ‘make’ to train the model?

Unless you install third-party tools, you can’t run the ‘make’ command in the Windows 7 command line. Copy the code from inside the Makefile and paste into the command line:

$ python -m rasa_core.train -d domain.yml -s stories.md -o models/dialogue

ModuleNotFoundError: No module named ‘rasa_core’

I got this after running the rasa_core.train command above. So I ran ‘pip install -U rasa_core’ (again, don’t forget to run as administrator like I did!) This led to the next error:

ERROR: rasa-nlu 0.15.0 has requirement future~=0.17.1, but you’ll have future 0.16.0 which is incompatible.

After a short web search, I just ignored this error because I was getting ready to chuck my laptop out the window. But the code still worked in the end. If you care to share any insights on it, please comment!

ModuleNotFoundError: No module named ‘named win32api’

This appeared after I tried to run the model test with ‘python -m rasa_nlu.server –path ./models’. A web search led me to this solution:

$ python -m pip install pypiwin32

It installed and said ‘successful,’ but the terminal was frozen with no prompt. I started another terminal and re-ran the model test command and…

terminal hangs at “Starting factory <twisted.web.server.Site object”, nothing happens

I thought that nothing happened, but really that was the command to start the server on port 5000. It had been hours since I read through the readme file, and I’d forgotten there was any mention of a server. And I’d seen so many obstacles I didn’t know what success looked like! In the Rasa forums there was a similarly confused poster, and an answer which suggested checking port 5000, but without any mention of HOW to check that port. I went back to the video and found the command:

$ curl XPOST localhost:5000/parse -d '{"query":"Hello", "project": "current"}'

It will need to run in a new terminal window. (When you’re finished you can kill the server in the first terminal window with Ctrl+C.) If you have GitBash installed or if you are using Windows 10 you can run curl. Change “Hello” to “yes”, or “I am Suzy”, and see the different results!