Devin Vinson – sharing thoughts and code

Arrow function as class function in ES6

If you’ve been using create-react-app and tried to build things on your own you might have done/seen/used
handleClick = () => { // do thing on click }

This comes from the Class properties transform plugin from Babel: https://babeljs.io/docs/plugins/transform-class-properties/

So if you try to build a project on your own you’ll need to include it to use that syntax so babel knows what to do with it. Otherwise you can do:
onClick={(e) => this.handleClick(e)

In the jsx itself but it *can* have performance issues if you are passing that onClick down as a prop.

I’ve not gone deep enough down the big app building track with a bunch of things composited in a way where this was an issue so I’ve used both. With that said…after thinking about this and going through it manually over the weekend I’ll probably get in the habit of using the public class fields syntax unless I see it get a notice that it has been deprecated for some reason in babel or I stop using babel to transpile.

Simple Login Style plugin

does anyone have a simple little plugin for custom login styles. I dont need a nuclear bomb option, just trying to make a simple thing

I saw this question pop up in the Post Status slack earlier and immediately thought “that would be a quick plugin to make using the WordPress Plugin Boilerplate”.

So lets walk through the steps:

What do we need to style the WordPress login page? https://codex.wordpress.org/Customizing_the_Login_Form

Thanks codex! We hook onto login_enqueue_scripts and then write over the appropriate styles as needed. Since the boilerplate already comes with two classes that enqueue a css file and js file I only needed to figure out which this best fit into: Admin or Public.

For me, I see this as public facing. The styles aren’t behind the login and there is no actual admin functionality. Maybe you see it as an admin thing so you could go the opposite of the next steps.

After generating a custom named build of the boilerplate from http://wppb.me/ I had my plugin 90% done:

After removing the parts I didn’t need from the folder structure:

In the simple-login-styles.php file I removed the functions to call the deactivation/activation hooks and then opened up the class-simple-login-styles.php to remove the admin dependency.

Now, the actual coding of the plugin was just changing where the public css and public js files were being enqueued at. Since the boilerplate uses the loader class to manage hooks and filters I moved down to those lines in the class-simple-login-styles.php file and edited:

And done.

AAR on my Standards talk

I posted my rambled thoughts on writing out my slides/talk for WordCamp Miami last week and I thought a after action report would be a nice follow up.

I ended up editing my slides a bit after talking with Topher DeRosia who was speaking just before me as part of our mini-workshop. I left out referencing core and focused more on the PHP standards directly. I’m not sure if it was the best call or not but it felt like it.

I also left out deep diving into the code of the boilerplate since I didn’t want to go heavily into objects and turn anyone immediately off of the idea of writing their own plugin. Again, I think this was a good call since I explained enough about DocBlocks that anyone interested should be comfortable in opening up the boilerplate files to search then read the inline documentation.

Ultimately I feel good about how it went because at least now there is a short overview of applying core standards to writing plugins out there for anyone interested 🙂

Update: I was searching something unrelated this morning and came across the somewhat new Plugin Handbook. 🙁 I wish I would have found/known about this before my talk. It is amazing reference and covers some points I did not go over because I didn’t have a core/official reference point.

I’ll be updating wppb at least to reference them 🙂

Writing WordPress plugins with Standards

[Note: I wrote this in bits and pieces over the past week or so which has caused it to be a bit all over the place 😁 ]

On May 31st I will be speaking at WordCamp Miami about the WordPress coding standards, documentation standards, and showing how to apply those when writing your own plugins.

Although it isn’t an overly flashy or seemingly exciting topic, it gels nicely with my obsession with project organization so *I* am excited to talk about it. I have not completely nailed down my slides yet so I’m going to write things out and use this post as an organizational/focusing exercise.

Lets start with the big one: WordPress Coding Standards for contributing to core.

No, plugins are not core but in an effort to follow best practices we can use the standards when writing our own plugins. If you are new to writing code this should be easy for you. Coming from outside of the WordPress bubble is a bit harder.

This will be immediately after an intro to writing plugins so I need to keep that in mind. Still though, the easiest part of following the standards is making sure your code editor of choice is using the rules for css/php/js. I’ll mark that as “definitely tell people to do that”.

This is something I want to make sure to highlight as well: https://make.wordpress.org/core/handbook/coding-standards/php/#clever-code

Clever is great and all, but at least explain it with a nice big comment 😑

Since the handbook covers so much I don’t want to re-re-re-re-repeat things that everyone will be able to go digest later on. Moving on…

Plugins, with standards! Plugins as a whole topic are really all over the place. If you go off of the codex entry for “Writing a Plugin” there is no telling what you might end up with. [As an aside, that page needs to be updated. Ouch. Maybe I can help 😕 ]

Since the codex is kind of eh in this case, where should you go? These are both good: Plugin Resources – Reference, Plugin Resources – Special Topics . Still though, we are just touching the surface and spitting out a bunch of links. Since I happen to be leading a pretty fancy pants plugin boilerplate which strives to follow best practices and standards I’ll jump into that. Yea, code all up in there.

I’m tempted to go up an add this into my previous thought but that is rather disingenuous. I totally forgot the best place to look at best practices for WordPress….is WordPress. Thankfully there was this exchange to remind me core typically is #doingitright:

@justintadlock I’d look at what core does. In media. I don’t remember what we do.

— Andrew Nacin (@nacin) May 29, 2015

I joined an agency, it’s been pretty great

Up until the summer of 2014, I had been pretty much working alone for 8 years. With a rocky start in my early twenties, I eventually landed on a stable diet of sub-contracted agency work, graphic design, photography and finally concentrated fully on development. I did things right and incorporated early – which gave me an impressive list of titles, as well as get everything set up great for taxes, billing, and payroll.

On the personal side of things: I got married, became a first time home buyer, and then a dad twice over. While there was a new level of stress to deal with, ultimately life was stable and my wife and I had worked hard together to get there. I really had no intention of shaking things up.

Oddly enough, it was a series of big, well-paying projects that put me in search of something else. Instead of doing lots of small work over the summer, I decided to schedule just a couple of big projects. They were challenging, fun, and I was working with some big names like ______ and _____.

The joy of an NDA means that even now I can’t say who I was working with or even what I was working on. All that code I could only loosely talk about for big names, I couldn’t say because I was working for an agency as a contractor and not an employee. While I don’t share much on social media, I do get overly excited and chatty in person about this kind of thing. Finishing up projects that I was proud of, but could not talk about at all those summer barbecues with friends and family was a struggle. I love what I do and it was that inability to talk about it that had me looking for another option.

Oh look, Range is hiring.

I spent more time than I’d like to admit looking at job requirements for being a developer at Range and wondering if I was really qualified. Eventually I overcame the self-doubt, wrote up my email (after I got permission to include some of my NDA work) and hit send. I wanted a small team with some big clients and room to grow. I didn’t apply anywhere else; I really wanted that job.

The end of this story is really no surprise, it is in fact the point of this post. I heard back from Range, we talked, I did a short trial, they offered the job and I accepted. WOO! I was definitely worried about being able to make the transition from working alone to working in a team, but it turned out to be pretty easy. We talked daily on slack, I took on a few projects and got into a new routine with a lot less isolation.

The Great

The biggest and most immediate impact was on my mental health. I could actually relax in the evening. I had no idea how much of my time was spent thinking about work, until I no longer had to handle and plan every last detail.

With less stress came increased personal growth. I tackled ideas and projects that had been on my todo list for months. Eventually this lead to my current leadership of the WordPress Plugin Boilerplate, as I had so clearly showed Tom McFarlin I had too much free time for my own good.

I’ve discovered how amazing it is to have work funded travel. My first full month at Range ended at WordCamp San Francisco. Going there had been on my radar the year before, but the potential planning of it all alone (combined with the potential cost) made for too easy of an excuse. This time I was sent there to meet up with my team.

The next time we all got together was for an official Range Meetup. Our project manager Laura wrote about it on the Range blog. A few weeks after that I was back in California at The Carneros Inn for a WordPress VIP conference.

Lets get sappy

I’ve been planning this post in my head since getting back from the meetup last month and writing it all out has been a lot of fun. Hopefully this post is the first of many more. I want to help contribute to the community of blog posts that I learned from and continue to learn from daily.

I still love development. I still loving working at Range with all the awesome people there. Although I don’t know how long this stage of my life will last, I do know I’m extremely happy to be here.

Writing, I should do more of it

One of my goals for 2015 was to get a bit more active on my own site. It has taken me a few months to realize I have not actually been working on this at all.

Whoops!

So here we are mid April with a fresh start and a happy new year. I have a few projects I’ve been working on that I’m hoping to write about in an effort to finish them quicker. You, the potential reader, will be my rubber duck.

Taking a break from Freelance for September

I’ll be unavailable for any freelance projects for all of September 2014 but I encourage anyone who is looking for some assistance to head on over to Codeable.io.

Codeable Contractor Reviews plugin

Edit: At some point in moving my site to a new server I did not copy over the plugin. I could probably dig it up from a backup if anyone ever requests it but otherwise I’ll leave the old post up for archival sake.

When Codeable updated their app to “2.0” they built it on a nice little api. I’ve been playing with WordPress and its api integration for a while now so I was quite excited to dig into another api.

Then again a new baby, summer, work, and generally life makes side projects….well side projects. Having said that I’ve got a very early version of the plugin available for any contractors who want to play with it below.

Notes

You need to add your contractor ID into the plugins file as the ID constant. Also its version .01 and powered by a nice bourbon so pardon the dust. It does work however 🙂

codeable-contractor-reviews

Usage
[codeable_reviews]
once installed. Some basic styling if you want:

.review-wrapper {
	border: 1px solid #ddd;
	border-radius: 3px;
	margin: 1%;
	padding: 15px;
	width: 48%;
	float: left;
	min-height: 210px;
}
.review-score {
    float: right;
}
img.review-avatar {
	border-radius: 2px;
	height: 60px;
	width: 60px;
	float: left;
	margin-right: 10px;
	}

Demo over on the project page here: http://devinvinson.com/codeable-contractor-reviews/

I’m going to push it to github after another revision as well.

A Year with Codeable

In late February of 2013 I found myself on a website called Codeable. A few minutes later I was emailing my credentials to try and get an invite to the live beta.

The idea was simple, but one which I had never heard of before: a freelancing job board connecting developers with clients, but without individual bidding for the client to choose from. Developers need to apply to have access to the clients and Codeable keeps everything running smoothly.

Continue reading “A Year with Codeable”

Enfold’s new Print stylesheet

I’ve been working on the Enfold theme’s new print.css file the past few days and thought I would put all the resources I’ve used/found/read in one place as well as some notes and thoughts. Continue reading “Enfold’s new Print stylesheet”