loading words...

Apr 27, 2019 23:22:31

Dev Journal: 27th April 2019

by @craigpetterson PATRON | 241 words | 165🔥 | 166💌

Craig Petterson

Current day streak: 165🔥
Total posts: 166💌
Total words: 44045 (176 pages 📄)

I've not managed to complete my goals for today, but I've had a great time playing around with Tailwind.

Goals for today:

  • Complete STEM Ambassador and DBS Applications
  • Strip out Bootstrap from The Cake Pays (and replicate existing screens using Tailwind)
  • Update welcome email copy for new sign ups

Complete STEM Ambassador and DBS Applications

I didn't even start this, but I should prioritise this tomorrow. I need to do this if I want to participate in a digital mentoring programme that will get students (particularly girls) into STEM roles, such as computing and development.

Strip out Bootstrap

As far as I'm concerned, it's just another tool like Bootstrap. The transition hasn't been as amazing as the hype suggested, but it is nice to use and I'm loving dabbling in design at the moment.

I spent a lot of time playing with Tailwind today. So much so that I technically achieved nothing.

I still need to finish the sign up pages, but I'm very happy with the outcome of this so far.

Email Copy

Wow, I have no idea what the hell I'm doing here. It's really difficult.

You want to sell your work, what features you have and maybe whats upcoming, but at the same time... there is nothing to sell at this stage. I think I need to wait until my main function is at a stage I'm happy with, but maybe a generic "thanks for joining" would suffice.

From Craig Petterson's collection:

  • 1

    @craigpetterson

    lmao what's your impressions on tailwind.

    as a developer wwriting markup for myself I lovvvee it! But when I think of it as markup i'm writing for others to consume -- maybe even other developers -- i feel like it's so sinful to put so many visual-utility classes on the markup itself.

    I've been thinking of a way where maybe I have a 'data-*' prefixed attribute for my tailwind classes and then check in my MVC controller whether the view is being rendered for my MVC application, or being rendered for an outside consumer.

    @if ($isExternalRendering)
    exclude tailwind classes
    @else
    include them.

    Sir Abe avatar Sir Abe | Apr 28, 2019 17:54:58
    • 1

      @abrahamKim For me, it's basically the same, but the defaults are nicer. Maybe that's just because bootstrap is so old and stale for me now.

      If you're concerned about it being too verbose, you can extract the utilities into a single class. eg; for my app, I know all my buttons are going to be rounded, no underline styling and with px-4 py-2, so I made a btn class in my tailwind file (eg; wherever you put this: https://tailwindcss.com/docs/installation#3-use-tailwind-in-your-css )

      .btn {
      @apply .px-4 .py-2 .rounded .no-underline
      }

      I'm not sure what you mean by the later part - why would an external application receive your css?

      AFAIK, Tailwind is quite lightweight, but you can look into PurgeCSS to remove even more unused code to make it even ligher.

      Let me know if you need a hand with anything ;)

      Craig Petterson avatar Craig Petterson | Apr 29, 2019 09:52:14
    • 1

      @craigpetterson

      I might try to @apply technique to 'boilerplate-prototypical-base-styles' but i'll still prob use minimal paddings/margins/sizes.

      I'm writing something that would be consumed by non developers -- so like embedding html -- that's why. Do you have experience doing this? I'm not expecting to open an API for developers to make their own stuff.

      Sir Abe avatar Sir Abe | Apr 29, 2019 22:24:18
    • 1

      @abrahamKim Hmm, are you planning to force them to use Tailwind?

      It could be better to forgot about tailwind, tell them to underlying CSS and maybe suggest that Tailwind can do this with x,y,z?

      Hard to say without more context. PM me on 200WAD Slack if you want to chat?

      Craig Petterson avatar Craig Petterson | Apr 30, 2019 13:23:37
    • 1

      @craigpetterson

      Never. I'm ideologically opposed to chat! lol.

      But no not trying to convince them of anything. It's just that they have a CMS web application and they just want to be able to load html from the app i'm working on within a content block they have. The css they'll do on their own.

      I just don't like the idea of sending such 'tainted' markup.. Tainted as in containing css-utility classes lol

      Sir Abe avatar Sir Abe | Apr 30, 2019 14:27:09
    • 1

      @abrahamKim (shocked pikachu)

      I'm still not sure what you're trying to achieve, sorry!

      Give me a link or a code example and I can give you my opinion.

      Craig Petterson avatar Craig Petterson | Apr 30, 2019 13:55:22
    • 1

      @craigpetterson

      Better yet I'll send you a link to the consumable HTML soon.

      Basically, Someone is just going to be consuming HTML snippets that they can embed.

      Sir Abe avatar Sir Abe | May 01, 2019 13:04:57
    • 1

      @abrahamKim I see, I look forward to it!

      Are you giving default classes? That way they can customise it using those classes rather than having to worry about adding their own.

      Craig Petterson avatar Craig Petterson | May 01, 2019 17:39:28
contact: email - twitter / Terms / Privacy