Flight attendant: Is there a doctor on this flight?
Dad: *nudging me* that should've been you
Me: Not now Dad
Dad: Not asking for a JavaScript developer to help, are they?
Me: Dad, plz
Dad: Go and see if console.log helps
One of my favorite tiny helpers is this "wait" function that allows you to use setTimeout with promises or async/await for cleaner, more readable code.
M1 MacBook Air update, battery life edition 🔋
Monday: Used for 8+ hours, streaming music most of that time. At the end of the day, I was at 72%
Today: Used for 6 hours so far, 5h of coding and 30m of Zoom meetings. Currently at 92%
🤯🤯🤯🤯🤯🤯
You're mad because no one can figure out useEffect useCallback and useEvent.
I'm mad because I have to call .value on a ref (in Vue)
We are not the same.
🔥 Hot
@tailwindcss
tip: use this code snippet to add a default duration to your transition classes, so you don't always have to add a duration-x class!
Gist for a11y:
Pro tip: when you're working with busy people, it's *not* bad or annoying to follow up, even multiple times. If you're offering something of value, or you're already working with them, they're most likely not ignoring you they're just swamped.
🔥
@tailwindcss
tip: Add custom screen breakpoints to your tailwind configuration, allowing you do max-width (desktop first) transformations, or to apply a class at *only* a single breakpoint (and not larger/smaller).
#tailwind
#css
#codeshowcase
For every example of Bad Tailwind™ I could find and provide 10 examples of bad CSS/SASS that are actually worse. The problems that Bad Tailwind provides are FAR less impactful to productivity than bad CSS.
@owltastic
@bootsified
Tailwind squad, can I PLEASE PLEASE ask you NOT to descend on Megan for this *opinion*? It’s perfectly fine for someone to not like a tech that you like. She didn’t say anything except she personally hates it, which is totally fair (even tho I feel differently) 🤷♂️
🔥
@tailwindcss
Hot Tip!
You can use config within a media query declaration to access your screen sizes!
This is particularly helpful when you want to create a media query that is "desktop first" instead of "mobile first" like using
@screens
wants them to be.
The new M1 MacBook Air has been ⚡️ lightning ⚡️ fast so far, but I'm currently downloading both Slack and Docker. We'll see if it can handle Docker + a couple Electron apps 😬
🔥
@CraftCMS
Pro-tip: The object-position CSS property allows you to make use of the focal point set on your image!
This, paired with object-fit allows you to imitate background-size/position but with an <img> element, which works better with lazy-loading 😄
The fabulous
@EmmaBostian
is killing it presenting on Micro-interactions to this amazing crowd here at
@Frontend_Love
!
Very excited to present to this crowd on Friday.
Inspired by
@stolinski
, I refactored my forms in
@vuejs
, and it saved me 30+ lines of code in just this one instance!
Check out this super-clean API inspired by Formol, a React form library:
🔥 Craft CMS Tip: Use the new map, filter, and reduce filters to clean up your code!
These functional array methods are one of the things I missed most (from JS) when working in Twig, but no longer!
Some news! Today is my last day at
@simplygoodwork
. It’s been an amazing 2.5 years and I wouldn’t trade it for anything.
Starting tomorrow I’ll be splitting my time between web freelancing and founding a startup with my friend
@ColtonNeifert
. More info to come on this! 😁
If you have a friend speaking: one of the best things you can do is sit where they can see you and nod your head. It gives the speaker so much confidence knowing that someone is listening and comprehending!
ps: don't get on your phone or laptop 🚩🚩
@remix_run
People are gonna think this is spicy, but it's not wrong to think you have better tradeoffs/opinions. If you didn't think your approach was much better, then you wouldn't have built Remix at all...
Vanilla JS Protip: Define $ and $$ as aliases for querySelector and querySelectorAll to create a jQuery like DOM selection interface in only 2 lines of code!
Gist:
Gonna attempt to check “build a CMS” off of my “things all devs do” bucket list soon 😆
Drop any advice/tips/encouragement you have in the comments, please ❤️
PS: please don’t say “don’t do it”
🔥
@vuejs
tip! Vue 2.6 exposes the Vue reactivity system so you can now more easily create a very basic global store!
This is a handy pattern for when you need a few pieces of global state, but Vuex seems a bit too much 😄
@chriscoyier
My favorite concept within DX is "making the right thing easy". Make the defaults accessible. Make the default config performant. Use defaults with good UX.
I built my first web app using
@remix_run
with a Node backend and it was such a nice experience as a developer and helped me produce a fantastic UX.
I'm a Vue guy through and through, but Remix makes React look good!
Sneak peek coming soon, public release tbd.
I think
@adamwathan
and
@steveschoger
should allow people to buy a lifetime license to anything they create. I honestly can't imagine them making something that I didn't want to buy. Between Tailwind, Tailwind UI, Refactoring UI, Advanced Vue, they are absolutely killing it! ❤
#CodeShowcase
4⃣: One thing I love to refactor are functions with a bunch of "if statements". If you're checking a string to return a value, you can refactor this into directly returning the key's value from an object for cleaner, more declarative code!
📅 Mark your calendars: tomorrow I'm going to learn XState with
@DavidKPiano
and we're going to stream it. Come tune in to learn it with me 🙌
We'll go live at 12pm EST on Thursday (Aug. 19)
@dabit3
If by partner you mean spouse, then we’d have 100k together because we’ll share finances. And we’d probably decide together to spend 5-10k of it together and individually and then invest the rest 😁
@dan_abramov
No that's not right 😂 If that's right, then I want to be wrong.
Pure doesn't mean it returns the same reference in memory, it means it returns an identical value every time. If it *did* mean that, it would be a worthless definition for practical application
Well, seems like a good time to announce that I've recently joined Facebook! 🎉
Not the company, just the app... and yeah I don't like it that much. But still cool!
Well, I'm either really good or really bad at freelancing. Today I start my new role as Dev Lead
@SteadfastTeam
🎉
I'm super excited to work with such a talented team, and see what we can achieve together!
🎉Super excited to add a
@gridsome
talk by
@JakeDohm
- Building Blazing 🔥 Fast Sites with
#Gridsome
A framework built on top of
#Vue
, that provides you features like pre-rendering, centralized
#GraphQL
data store, and a plethora of performance and more
I've been trying something new where I don't code after dinner 🌯. To achieve this, I get up early (6:30am) and work on side-projects for a couple hours before starting *real* work around 9am.
It's been awesome, but I have so many ideas I'm tempted to break my rule tonight 👀
Not bought into the Composition API in Vue 3 yet? Not a problem! You can use the Options API for 90% of your component code, and only use the setup() function for custom or 3rd party composables.
Tweet inspired by
@MichaelThiessen
the Vue Wizard.
@EmmaWedekind
The audience isn't waiting for you to fail, they're actually rooting for you, and hoping you succeed!
Figuring this out, and reminding myself of it has helped me as a speaker 😄
@isaacfink123
@adamwathan
No it’s proving that for $84 a month you can ignore the complexity of serverless and make enough money to fund a small company
I cannot agree with this enough. In tech, the only thing that spreads faster than a good reputation is a bad reputation.
*The* way to set yourself apart as a web developer, is to be thoughtful and kind in your interactions with people.
Popular opinion*:
@ASpittel
is a fantastic person, an incredible dev, and an amazing teacher. I’m so thankful to have you in our community, Ali, you’re the best.
*among reasonable people
I just released my first screencast! 🥳 We'll be putting out videos on
@vuejs
,
@CraftCMS
, JavaScript,
@tailwindcss
, and more, every week!
Check out the first one here:
🥁 Working on this new Vue <Tabs> library. Expect an alpha-release by Monday night. Features will include:
✨ Clean and flexible API
♿️ Full ARIA compliance, so fully accessible
💅 No styling opinions, so you can use it with any CSS framework or library
you should refactor tech debt as you work on features
a lot of teams try to "prioritize" reducing tech debt in dedicated sprints, but it rarely happens (as it's hard to describe the value)
instead, make it the norm to refactor as you go
in crunch time, you can make exceptions
There’s been a lot of talk about what “frontend” means these days. I really recommend
@chriscoyier
’s talk on this subject that I think is really helpful:
I really love the
@code
feature that grays out unused variables. It's especially handy when refactoring code to remove a variable. If the variable is gray, you've removed all instances of it's use 👌
@jensimmons
For all of those following along at home:
1) in my experience, almost no one using Tailwind is shipping 12mb of CSS, and Tailwind explicitly warns against using the full build
2) Utility classes are NOT the same as inline styles. There are many many differences (will write more)
PLEASE don't put this type of response on your resume. It's never true, and definitely doesn't give me a good impression of your humility and personality.
📦 Whipped up a small composition function in
@vuejs
to allow me to store a reactive value in localStorage.
It works just like `ref()`, except that it persists the value!
Code:
When creating a Composition Function with
@vuejs
, it is dangerous to directly return an object created with reactive(), because if users destructure a value, it will lose reactivity. To prevent this, Vue has a toRefs() method which will create an object of refs()
Oh, hey, my PR adding documentation on how to use
@tailwindcss
with
@gatsbyjs
has landed and is in the official Gatsby docs! 🎉
And, by popular request, it covers how to use it with PostCSS *and* CSS-in-JS 😁
Scheduled messages in Slack are my best friend as a manager. When I’m working late, which happens a lot, I’ll schedule messages for the next day so no one’s off-hours are interrupted!
Just got
@PrettierCode
working on a project for the first time in a while and I forgot how much better it makes my life. Not thinking about quotes, semicolons, or whitespace makes my life so happy