Intro to JSX

Have you looked at any Gutenberg code recently?

If you’re not familiar with React and it’s proprietary JSX “language”, it can make your head spin a bit.

Micah of WP Scholar (and WordPress Gwinnett assistant organizer) is going to give us an intro to the “language” of Gutenberg: JSX.

So join us Thursday, June 21, at 7:45pm, and level up your Gutenberg code read-ability.

Gutenberg and Themes

Have you wondered

“How does Gutenberg affect themes?”

“What do I need to do with my theme(s) to get ready for Gutenberg?”

or

“Where do theme developers fit into the whole Gutenberg world?”

We’re excited to have Rich Tabor of ThemeBeans.com, MerlinWP.com, and Envato Theme Reviewer, who has written extensively on how to get your themes Gutenberg-ready, joining us for a discussion on Gutenberg in the context of, themes.

So join us Thursday, March 13, at 7:45pm, and get all of your Gutenberg and themes questions answered.

Gutenberg for Developers

Have you heard about Gutenberg, the all-new, drastically different publishing experience that will be released in the next version of WordPress?

This change impacts everyone using WordPress, from general users to those working with clients and developing solutions on top of WordPress.

If you haven’t tried out Gutenberg for yourself, I’d highly recommend you give it a try.  It is important to familiarize yourself with the user experience in order to be able to make sense of all the ways you can integrate with it.

Ultimately, many things that are currently managed by custom meta boxes in WordPress can likely be replaced with custom blocks in Gutenberg. A block is essentially a stand-alone editing component.  Examples of existing blocks are an image block for inserting and managing images, a text block for standard text content and a gallery component for managing collections of images. At the meetup, we covered how to create a custom block, which we called ‘Gutenbook’; a block that allows you to insert a book title, description, and author in a card view format. View the code on GitHub.

The Gutenberg editor has a few layers to it. First, the primary technology behind it is React; Facebook’s JavaScript view library. Second, there is a new WordPress JavaScript API that layers on top of React that you will use to create Gutenberg blocks. Finally, there is the code you will write to leverage all the tools that Gutenberg provides to create your own blocks.

Suggested Resources

If you are interested in how to create your own Gutenberg block, take a look at these helpful resources:

 

Launching A Successful WordPress Product

Ever wondered what it takes to launch a successful WordPress product?

You’re a developer (or aspire to be one) with ideas, and maybe you could make some money peddling your wares.

After 5 years in the WordPress product business and multiple products under her belt, Naomi’s going to use the lessons from her most recent product launch to provide her checklist on what you need to set yourself up for success.

Hint: it’s not just code. It’s never just code. Code is only half the battle.



So come on out, Thursday, June 15, 7:45-8:45pm.


Notes: A Gentle Introduction to ES6





  • http://kangax.github.io/compat-table/es6/

  • var => keywords let and const to help prevent unnecessary errors

    • var can be reassigned and redeclared
    • let can be reassigned but not redeclared
    • const cannot be reassigned or redeclared
    • const is not hoisted

  • Function Scoping => Function Scoping + Block Scoping

    • var can only be function scoped
    • let and const are block scoped

  • Template Literals

    • string concatenation => string interpolation
    • explicit line breaks in a string => multi-line strings

  • Default Values

  • Anonymous functions => Arrow Functions

    • arrow functions keep context

  • Destructuring

    • arrays, objects, nested objects, renaming

  • pass individual parameters to a function => rest parameters

  • concat => spread operator

  • forEach => for..of

  • constructors => classes



To learn more, see our resource list for JavaScript for WordPress developers

A Gentle Introduction to ES6

ES what?

ES6 is just a fancy way to say the new version of JavaScript. Before ES6 was finally released in 2015, there hadn’t been a new version of JS since 2009, so it’s kind of a big deal.

But why does this matter for WordPress?

WordPress is increasingly using more and more JS, whether in the admin, themes, or plugins.

The founder of WordPress pointed out this evolution and encouraged us to “Learn JavaScript Deeply”.

And the current priorities for WordPress development — customization, the editing experience, and the REST API — all require JS.

So, if you want to develop for WordPress, learning JS in addition to PHP is a necessity.

Ok, so I get why I need to know JavaScript now, but what’s so special about this ES6?

Good question. Since it’s the new version of JavaScript and has some helpful features to help write better code, you need to start learning it. In our meetup, Micah’s going to help us get started.

Now, browsers are still implementing this new version of JS so all of the features aren’t available yet in all browsers. Micah’s going to show us how to use a transpiler (a what?) to allow us to use the new features but still have our code work in all browsers.



So come on out, Thursday, May 18, 7:45-8:45pm.


P.S. If you want to get a headstart or just want to know a little bit more before the meetup so you can ask better questions, we created a quick resource list for learning more about the JS world and how it fits into WordPress.

Getting Started with JavaScript for WordPress

But do I have to?

Yes! WordPress is increasingly using more and more JS, whether in the admin, themes, or plugins. The founder of WordPress pointed out this evolution and encouraged us to “Learn JavaScript Deeply”. And the current priorities for WordPress development — customization, the editing experience, and the REST API — all require JS. So, if you want to develop for WordPress, learning JS in addition to PHP is a necessity. Article: JavaScript and WordPress

The Landscape

The JavaScript world is big, and seems to only be getting bigger and more complicated everyday. You can get caught up in frameworks and tooling, but here are some helpful places to get a grasp on the JavaScript world and how everything fits.

The Language

ES6

Notes: A Simple Introduction to the WordPress REST API