Register a SA Forums Account here!
JOINING THE SA FORUMS WILL REMOVE THIS BIG AD, THE ANNOYING UNDERLINED ADS, AND STUPID INTERSTITIAL ADS!!!

You can: log in, read the tech support FAQ, or request your lost password. This dumb message (and those ads) will appear on every screen until you register! Get rid of this crap by registering your own SA Forums Account and joining roughly 150,000 Goons, for the one-time price of $9.95! We charge money because it costs us money per month for bills, and since we don't believe in showing ads to our users, we try to make the money back through forum registrations.
 
  • Post
  • Reply
Lumpy
Apr 26, 2002

La! La! La! Laaaa!



College Slice

The Merkinman posted:

Does anyone have any recommendations for learning React? I have plenty of Angular and Vue experience, but it feels like without React, I'm unhirable.

I did the Tic Tac Toe tutorial, and that just made me really confused about how React does things as a whole compared to Angular and Vue. Is React that different or is that Tic Tac Toe a poor example of how things would "really" be ?

As the wise prom candy said:

prom candy posted:

if you have questions :justpost:

I looked at that tutorial quick, and it seems really stupid the way they wrote it... starting with class components (which nobody really uses any more) and then converting them to functional ones seems like maybe they were trying to teach JS developers coming from an OOP place, rather than someone who is familiar with "modern" JS / frameworks, so it probably is not the best place to start.

If you are interested in a tic tac toe tutorial, I bet we could talk you through it in here. I don't really know any good places to get started, since I started so long ago I haven't kept current on that stuff.

Adbot
ADBOT LOVES YOU

Verisimilidude
Dec 20, 2006

Strike quick and hurry at him,
not caring to hit or miss.
So that you dishonor him before the judges



Knowing how class components operate and things like life cycle methods is still very useful and a dev, especially starting devs, should have some experience with them. They're not the most optimal or up-to-date solution, but a lot of frontends are still utilizing class components for any number of reasons. Don't ignore them!

Verisimilidude
Dec 20, 2006

Strike quick and hurry at him,
not caring to hit or miss.
So that you dishonor him before the judges



Does anyone have a solid guide on integrating Jest for unit testing into a react frontend? I'm looking more for practical workflow how-tos. Organization, best practices, examples of different tests, quirks and features, etc.

the heat goes wrong
Dec 31, 2005
I´m watching you...

The Merkinman posted:

Does anyone have any recommendations for learning React? I have plenty of Angular and Vue experience, but it feels like without React, I'm unhirable.

I did the Tic Tac Toe tutorial, and that just made me really confused about how React does things as a whole compared to Angular and Vue. Is React that different or is that Tic Tac Toe a poor example of how things would "really" be ?

The Tic-Tac-Toe one should be the quite dated one, that still used class components.
You can use the new documentation, thats still in beta at https://beta.reactjs.org/

My usual method of learning stuff like this is to read official documentation or finding some highly ranked Udemy course, and after that just building lots of small things using it.

Boba Pearl
Dec 27, 2019

by Athanatos
So this does exactly what I want, but I don't know where to put the code from Stack Exchange, or how exactly it works, would I put it in the single post file in the theme?

https://wordpress.stackexchange.com/questions/149826/display-posts-from-the-same-category-using-next-previous-post-link

Wait actually I found something here:

https://developer.wordpress.org/reference/functions/next_post_link/

This would do it right? Where do I put that code? In the post template?

Then I can use this to get the first and last link, and use that to make the First and Last buttons, then I can just line them up across the page, and just rip out the plugin I was using for this.

https://wordpress.stackexchange.com/questions/363822/how-can-you-get-first-post-last-post-and-post-count-in-a-category

Boba Pearl fucked around with this message at 08:42 on Jan 27, 2022

aperfectcirclefan
Nov 21, 2021

by Hand Knit
If you're using the built in posts functionality then yeah it goes into the theme file, if not then you need to look up the template heirarchy. If you want help send me a PM and I can walk you through exactly

Nolgthorn
Jan 30, 2001

The pendulum of the mind alternates between sense and nonsense
Hello fine people of the internet. I have a CSS question! I know you're all dying to see it.

https://jsfiddle.net/df0g4rek/1/

I've extracted this simplified example from an existing code base! Div `container` is whatever, it's just somewhere on the page. Div `outer` and div `inner` are both thanks to this 3rd party library that replaces native scrollbars with custom ones. I've removed the javascript code from the example, because it's not relevant.

Other than the fact they exist and my client wants to use that library. They are customizable so if those are the cause of the problem by all means tell me.

Within this scrollable area, there's div `background` which has to be there and is the focus of the issue. And div `square` which acts as placeholder content. Ideally when you scroll to the right, div `background` would extend all the way across. But it does not.

It's like the browser stops bothering to render it, "oh nobody will ever scroll to the right." it says.

Nolgthorn fucked around with this message at 16:28 on Jan 27, 2022

LifeLynx
Feb 27, 2001

Dang so this is like looking over his shoulder in real-time
Grimey Drawer

Nolgthorn posted:

Hello fine people of the internet. I have a CSS question! I know you're all dying to see it.

https://jsfiddle.net/df0g4rek/1/

I've extracted this simplified example from an existing code base! Div `container` is whatever, it's just somewhere on the page. Div `outer` and div `inner` are both thanks to this 3rd party library that replaces native scrollbars with custom ones. I've removed the javascript code from the example, because it's not relevant.

Other than the fact they exist and my client wants to use that library. They are customizable so if those are the cause of the problem by all means tell me.

Within this scrollable area, there's div `background` which has to be there and is the focus of the issue. And div `square` which acts as placeholder content. Ideally when you scroll to the right, div `background` would extend all the way across. But it does not.

It's like the browser stops bothering to render it, "oh nobody will ever scroll to the right." it says.

Adding width: fit-content; on the .background div seems to work (in Chrome at least, haven't extensively tested it).

Nolgthorn
Jan 30, 2001

The pendulum of the mind alternates between sense and nonsense
Oh my god. I've been coming back to this problem for days thank you.

kedo
Nov 27, 2007

Does anyone have a favorite modern host that offers managed LAMP dedicated virtual servers? I use Digital Ocean droplets for a lot of personal projects/spinning up quick dev environments I can share with clients, but I don't think they handle things like updating packages/applying OS updates/managing firewalls/etc. Best case scenario I need a host that will give me enough control that I can modify Apache configs (for example), but otherwise manages server security/updates so I don't have to be on the hook for that sort of thing forevermore.

Any ideas?

N.Z.'s Champion
Jun 8, 2003

Yam Slacker
The new ReactJS site has much better examples https://beta.reactjs.org/

fletcher
Jun 27, 2003

ken park is my favorite movie

Cybernetic Crumb

kedo posted:

Does anyone have a favorite modern host that offers managed LAMP dedicated virtual servers? I use Digital Ocean droplets for a lot of personal projects/spinning up quick dev environments I can share with clients, but I don't think they handle things like updating packages/applying OS updates/managing firewalls/etc. Best case scenario I need a host that will give me enough control that I can modify Apache configs (for example), but otherwise manages server security/updates so I don't have to be on the hook for that sort of thing forevermore.

Any ideas?

Maybe a PaaS like Heroku?

Violator
May 15, 2003


kedo posted:

Does anyone have a favorite modern host that offers managed LAMP dedicated virtual servers? I use Digital Ocean droplets for a lot of personal projects/spinning up quick dev environments I can share with clients, but I don't think they handle things like updating packages/applying OS updates/managing firewalls/etc. Best case scenario I need a host that will give me enough control that I can modify Apache configs (for example), but otherwise manages server security/updates so I don't have to be on the hook for that sort of thing forevermore.

Any ideas?

I’ve been thinking about this for awhile, too. I’ve run sites on droplets, managed VPS, and dedicated servers over the years. Like you said, after the initial setup there is very little the provider typically needs to do besides apply system patches if everything is already running smoothly. And with several of the hosts I’ve interfaced with, I know more than the first tier of support that you’re expected to interface with and I’m pretty dumb.

So instead of paying a pretty big price increase every month for an impersonal managed service that is mostly just automated stuff on the host’s end, I’ve been thinking about finding someone to help with this. Hire someone for an hour or two every few months to review things and apply any patches. And this way if you have a specific problem they’re more likely to know a good answer instead of whatever internal documentation tells them to say. They would also be able to help with a more robust selection of hosts (DO, Linode, etc) instead of being tied to one service.

Still trying to figure out if this is the best path forward and how realistic it is.

Boba Pearl
Dec 27, 2019

by Athanatos
I have BUTTONS!



Huge thank you to aperfectcirclefan for helping me with all the code. It's so pretty now.

I mean, I'm sure it's hideous, because I'm color blind, but I have buttons and it didn't cost me 200$

aperfectcirclefan
Nov 21, 2021

by Hand Knit
No worries. Can't believe that guy charges $200 a year(?) for what is essentially two lines of code

Boba Pearl
Dec 27, 2019

by Athanatos
It's called Publish Press, you can't just buy the series plug-in, and I have two websites

https://publishpress.com/pricing/

It's 249$ now.

camoseven
Dec 30, 2005

RODOLPHONE RINGIN'

Boba Pearl posted:

It's called Publish Press, you can't just buy the series plug-in, and I have two websites

https://publishpress.com/pricing/

It's 249$ now.

Haha this rules. There's absolutely no way those big companies use that product (or even use Wordpress at all)

Vincent Valentine
Feb 28, 2006

Murdertime

Maybe it's one of those situations where the client-facing software is really great and professionally done and has a team of 30+ engineers working long hours to make it incredible.

But then Disney's internal applications for employee use are just loving garbage that they spent five dollars and a threat on, and haven't had a single bug fixed in ten years. Wordpress, plugins and a prayer to power the entire internal infrastructure.

barkbell
Apr 14, 2006

woof
I wouldn't be surprised if Uber or Disney had a WP team running the finance dept's blog or something

aperfectcirclefan
Nov 21, 2021

by Hand Knit
Disney parks blog is WordPress but I still doubt they use the plugin. Maybe they do.

D34THROW
Jan 29, 2012

RETAIL RETAIL LISTEN TO ME BITCH ABOUT RETAIL
:rant:
So fun to spend literally 3 hours trying to figure out how, between CSS and HTML, to coerce a table into having a 30% column and a 70% column :bang: On the plus side, at least I discovered <colgroup>.

prom candy
Dec 16, 2005

Only I may dance

D34THROW posted:

So fun to spend literally 3 hours trying to figure out how, between CSS and HTML, to coerce a table into having a 30% column and a 70% column :bang: On the plus side, at least I discovered <colgroup>.

Isn't css grid supposed to deliver us from these woes?

Lumpy
Apr 26, 2002

La! La! La! Laaaa!



College Slice

prom candy posted:

Isn't css grid supposed to deliver us from these woes?

Yep, you can do it in flexbox as well, but grid is the right tool for the job.

Doh004
Apr 22, 2007

Mmmmm Donuts...
Man, anyone have any great references or cheat sheets for fixing accessibility issues on existing websites without straight up rewriting things? Inherited a modern NextJS website but with a lot of bad patterns that's making the website inaccessible (primarily keyboard navigation) and this isn't my actual wheelhouse.

aperfectcirclefan
Nov 21, 2021

by Hand Knit
Run it through Wave Accessibility and make sure you say you take 0 liability for accessibility and you are simply making adjustments to make the site friebdlier because if they get sued they'll come after you

The Merkinman
Apr 22, 2007

I sell only quality merkins. What is a merkin you ask? Why, it's a wig for your genitals!

Doh004 posted:

Man, anyone have any great references or cheat sheets for fixing accessibility issues on existing websites without straight up rewriting things? Inherited a modern NextJS website but with a lot of bad patterns that's making the website inaccessible (primarily keyboard navigation) and this isn't my actual wheelhouse.

How do you know it's not accessible? Could try the accessibility tools in Chrome (Lighthouse Accessibility) and Firefox (Inspect Accessibility Options). Ideally there should be a person/team for A11y, like in UX making the components in the first place. It's sad that it's so deprioritized across the industry.

I'd just go component by component. There is no quick fix, and those overlay things are really just band-aids. For references, there is of course WCAG.

Doh004
Apr 22, 2007

Mmmmm Donuts...
Already dealing with legal issues and we've run the site through all the automated tools that have called out a lot of buttons/actions are not keyboard accessible etc. And yep, familiar with the standards but I'm getting pretty stumped with weird things. Like I have an <input> of type "checkbox" and it's not included in the keyboard navigation. I shouldn't have to add tabindex=0 to it or anything given it's the native element with the appropriate type, right? It's things like this where the official guidance says so but it doesn't happen. It might also be because it's part of a drawer that expands in upon an action (but is rendered ahead of time but hidden off screen).

It's things like the above that I was hoping there was more specific guidance or lessons learned.

Also, this is a startup where we have 2 engineers, one of which is me (and I'm the head of engineering trying to hire a team) where we're handling the entire stack/infrastructure/marketing needs etc. - we don't have a dedicated accessibly team or person to do this.

Doh004 fucked around with this message at 16:08 on Feb 1, 2022

ynohtna
Feb 16, 2007

backwoods compatible
Illegal Hen
Disable CSS styles for an immediate view of major node ordering (and thus tab-key sequencing) issues, and places where screen readers will read out duplicate entries, bad alt texts, decorative text not being invisible, etc.

The Merkinman
Apr 22, 2007

I sell only quality merkins. What is a merkin you ask? Why, it's a wig for your genitals!

Doh004 posted:

Like I have an <input> of type "checkbox" and it's not included in the keyboard navigation.

Is there any CSS hiding this so it has a custom style? If so, input[type="checkbox"] cannot be display:none.

Doh004
Apr 22, 2007

Mmmmm Donuts...

ynohtna posted:

Disable CSS styles for an immediate view of major node ordering (and thus tab-key sequencing) issues, and places where screen readers will read out duplicate entries, bad alt texts, decorative text not being invisible, etc.

Oooh I'll give this a shot, thank you.

The Merkinman posted:

Is there any CSS hiding this so it has a custom style? If so, input[type="checkbox"] cannot be display:none.

I hadn't checked that the larger drawer was hidden like that (thought it was just off screen). I'll give that a look but other items within that draw DO come up in the keyboard navigation.

Violator
May 15, 2003


What industry is this site in where you're dealing with legal issues?

Doh004
Apr 22, 2007

Mmmmm Donuts...

Violator posted:

What industry is this site in where you're dealing with legal issues?

Health and ecommerce. Company's been around for about 3 years and previously just farmed all of their technology work out to agencies and consultants. Finally bringing technology inhouse (where I come in) and there's a lot of catching up to do.

kedo
Nov 27, 2007

I mean, in theory any website that does business in California (which is basically any site on the English speaking internet) is open to being sued over accessibility issues these days, no?

e: Maybe, maybe not? I'm not a lawyer.

quote:

Aside from the ADA, a federal law, another piece of California legislation also protects persons with disabilities. This is the Unruh Civil Rights Act.

Under the Unruh Act, plaintiffs can be awarded up to three times in statutory damages or at least $4,000 for each count of violation. This is in stark contrast to the ADA, which only permits attorney’s fees and injunctive relief. So this means that if you are caught in violation of the ADA and your business is located in California, your business might find itself doubly in distress due to the provisions of the Unruh Act.

Unfortunately, even if both the ADA and Unruh Act were passed to uphold civil rights, these can also be used by unscrupulous citizens to squeeze money from even the most honest businesses. Statutory damages awarded to plaintiffs through the Unruh Act, in particular, has been reason enough for numerous frivolous claims filed in court against California businesses.

https://adacompliancepros.com/ada-website-compliance-in-california/

e2: Potentially more applicable

quote:

The Unruh Act that mandates that all Californians – no matter what their sex, race, color, religion, ancestry, national origin, disability, medical condition, genetic information, marital status, sexual orientation, citizenship, primary language, or immigration status – are entitled to the full and equal accommodations in all business establishments. In addition to the specific provisions of the Unruh Act, the Unruh Act provides that a violation of the Americans with Disabilities Act (ADA) constitutes a violation of the Unruh Act.

Cases alleging website inaccessibility under the ADA and parallel state statutes like California’s Unruh Act are common. Unfortunately, there is no clear mandate from Congress, nor regulations describing exactly which private entities must make their websites accessible and what “accessible” means. Companies are left to follow industry standards and patchwork case law. Given the proliferation of such suits and the cost to resolve them, businesses are prudent to review their websites for accessibility issues and potentially make corrective measures.

https://www.foley.com/en/insights/p...0accommodations

kedo fucked around with this message at 17:54 on Feb 1, 2022

Doh004
Apr 22, 2007

Mmmmm Donuts...

kedo posted:

I mean, in theory any website that does business in California (which is basically any site on the English speaking internet) is open to being sued over accessibility issues these days, no?

e: Maybe, maybe not? I'm not a lawyer.

https://adacompliancepros.com/ada-website-compliance-in-california/

e2: Potentially more applicable

https://www.foley.com/en/insights/p...0accommodations

Yeah that's basically it.

If anyone is looking for some contract work and some money: https://forums.somethingawful.com/showthread.php?threadid=3875694&pagenumber=2#post521155030

The Merkinman
Apr 22, 2007

I sell only quality merkins. What is a merkin you ask? Why, it's a wig for your genitals!
Anyone family with Vue 3 and VueDraggable? I have an app that's on Vue 2 and I want to update it, but VueDraggable (upgraded to 'next') isn't working. I'm getting an issue like this person but to debug, I don't have multiple root nodes, and I changed to to element

code:
// data (from endpoint)
groups = [
 {
  "groupId": 5481,
  "groupLabel": "Figure 1",
  "groupDescription": ""	
 },
 {
  "groupId": 2341,
  "groupLabel": "Figure 2",
  "groupDescription": ""
 }
//etc
]

<template>
 <draggable v-model="data.groups" item-key="groupId">
  <template #item="{element}">
   <pre>{{element.groupId}}</pre>
  </template>
 </draggable>
</template>

CarForumPoster
Jun 26, 2013

⚡POWER⚡

kedo posted:

I mean, in theory any website that does business in California (which is basically any site on the English speaking internet) is open to being sued over accessibility issues these days, no?

e: Maybe, maybe not? I'm not a lawyer.

https://adacompliancepros.com/ada-website-compliance-in-california/

e2: Potentially more applicable

https://www.foley.com/en/insights/p...0accommodations

Can't speak to CA but you dont even need a website. I have seen a website ADA case against a hotel that didnt have a loving website. They ONLY listed their hotel on expedia and other third parties.

The plaintiffs attorney uses a mail merge and has a sentence for the website and it just had two spaces where the URL typically goes. The ADA-access plaintiffs bar is filled with fraudsters who have found a legal means to shake down businesses. Actually fixing issues with your website, even to the point of WCAG compliance, will only somewhat protect you.

teen phone cutie
Jun 18, 2012

last year i rewrote something awful from scratch because i hate myself
nvm. wondering why prettier wasn't linting my JS files, but it's because I had an ignore on index.js files

teen phone cutie fucked around with this message at 20:07 on Feb 3, 2022

D34THROW
Jan 29, 2012

RETAIL RETAIL LISTEN TO ME BITCH ABOUT RETAIL
:rant:
So I'm following Miguel Grinberg's Flask tutorials as I work my way through an app to (hopefully) help everyone in my company and not just me. It's also a way to combine Python/CSS/HTML practice into one.

There's a section on converting to Bootstrap for CSS and whatnot. However, I already have a disgusting amount of CSS to coerce things to work the way I want them to. Is it worth changing over to Bootstrap given its integration with other tools like dataTables.js?

Also, I want to have a single Jinja template that does not need to be rerendered every time a row needs to be added. Can this be accomplished with Javascript to add another <td> of controls and Flask to process that input?

camoseven
Dec 30, 2005

RODOLPHONE RINGIN'

D34THROW posted:

There's a section on converting to Bootstrap for CSS and whatnot. However, I already have a disgusting amount of CSS to coerce things to work the way I want them to. Is it worth changing over to Bootstrap given its integration with other tools like dataTables.js?

Bootstrap tends to reduce the amount of CSS you need to write since it has so much functionality built in. That said, Tailwind seems to be the library of choice for a lot of new projects these days.

Adbot
ADBOT LOVES YOU

Summit
Mar 6, 2004

David wanted you to have this.
Bootstrap and Tailwind are solving different problems, I’m not sure why it’s necessary to compare them and declare a winner. Both are quite good at what they do and the one you end up liking is really more a personal choice.

  • 1
  • 2
  • 3
  • 4
  • 5
  • Post
  • Reply