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
The Merkinman
Apr 22, 2007

I sell only quality merkins. What is a merkin you ask? Why, it's a wig for your genitals!
Is there a number for the contrast between colors? I'mnot talking about the contrast between text and its background color.

I'm saying if I have 3 things all the same, let's say just solid circles, how to check they have enough contrast between themselves, and the white background.

Adbot
ADBOT LOVES YOU

HappyHippo
Nov 19, 2003
Do you have an Air Miles Card?

The Merkinman posted:

Is there a number for the contrast between colors? I'mnot talking about the contrast between text and its background color.

I'm saying if I have 3 things all the same, let's say just solid circles, how to check they have enough contrast between themselves, and the white background.

https://en.m.wikipedia.org/wiki/Color_difference has some info on this

aperfectcirclefan
Nov 21, 2021

by Hand Knit
What do you guys recommend for a CMS that allows users to submit content? I'd like it to work with Vue but I can go with anything. I know Wordpress is a option but i'd like something that looks a bit...modern

Enos Cabell
Nov 3, 2004


Hey all, not sure if this is better suited for this thread or the get a job thread but figured I'd start here. I left a state govt IT position of 24 years earlier this summer that at one point I thought I'd retire in. A string of lovely governors and lovely management decisions led to a real lovely working environment, and I decided a change was in order.

So I quit my job and am living off savings while doing a front end dev bootcamp through our local community college and Promineo Tech. Only a few weeks in, but I'm really digging it so far. JavaScript feels really intuitive, and although almost 100% of my experience is on the hardware side of things, that background is helping me pick stuff up way faster than the other students seem to be.

Anyway, this is our curriculum for the bootcamp:

Introduction to JavaScript (Weeks 1-6)

JavaScript
Algorithms
OOP
Design Patterns
Unit Testing

Front End Technologies (Weeks 7-13)

HTML
CSS
JQuery
Bootstrap
AJAX

Web App Design with React (Weeks 13-18)

ReactJS
JSX
AWS
REST
NPM

I'm also working through the lessons at freeCodeAcademy, and picked up a few courses at Udemy. Anything else I should be focusing on to increase my chances at landing a job next spring/summer?

Lumpy
Apr 26, 2002

La! La! La! Laaaa!



College Slice

Enos Cabell posted:

Hey all, not sure if this is better suited for this thread or the get a job thread but figured I'd start here. I left a state govt IT position of 24 years earlier this summer that at one point I thought I'd retire in. A string of lovely governors and lovely management decisions led to a real lovely working environment, and I decided a change was in order.

So I quit my job and am living off savings while doing a front end dev bootcamp through our local community college and Promineo Tech. Only a few weeks in, but I'm really digging it so far. JavaScript feels really intuitive, and although almost 100% of my experience is on the hardware side of things, that background is helping me pick stuff up way faster than the other students seem to be.

Anyway, this is our curriculum for the bootcamp:

Introduction to JavaScript (Weeks 1-6)

JavaScript
Algorithms
OOP
Design Patterns
Unit Testing

Front End Technologies (Weeks 7-13)

HTML
CSS
JQuery
Bootstrap
AJAX

Web App Design with React (Weeks 13-18)

ReactJS
JSX
AWS
REST
NPM

I'm also working through the lessons at freeCodeAcademy, and picked up a few courses at Udemy. Anything else I should be focusing on to increase my chances at landing a job next spring/summer?

Typescript and maybe GraphQL. Typescript is amazingly useful and wonderful, and GraphQL is "hot". And when you are learning the JQuery stuff from that bootcamp, promptly forget it right after the test / assignment. Try to do all your JS assignments in Typescript if you can, even if it means doing them in JS for the class, then re-doing them in TS after.

minato
Jun 7, 2004

cutty cain't hang, say 7-up.
Taco Defender
+1 to ignoring jQuery. It was essential 10 years ago when it provided a standard set of useful functions that worked cross-browser. But all the useful stuff eventually made its way into the browser APIs, and the cross-browser variations aren't anywhere near as bad as they used to be (or at least, JS compilation tools like Babel will automatically add polyfills to take care of it for you). These days you only see jQuery on legacy sites (like this one), and it's still used by Bootstrap to support some dynamic form components. The main thing to know is whenever you see a function call like "$('#foo')....", that "$()" function is jQuery's main entry point.

I also highly recommend the Mozilla Developer Network (MDN) docs for anything JavaScript or web-related. The docs are excellent, lots of samples, sandboxes to try stuff in-browser, etc.

And an anti-recommendation: as you will soon find, w3schools and a few other sites are nothing but garbage, but they always float to the top of Google results. You can use some uBlock origin filter config to hide those search results: google.*##.g:has(a[href*="w3schools.com"])

Finally, invest some time in learning basics of UI design; layout, color schemes, supporting accessibility. Even if you know how to create a functional website, it's still a challenge to design that is easy to use, looks good, and assists differently-abled people.

Lumpy
Apr 26, 2002

La! La! La! Laaaa!



College Slice

minato posted:

Finally, invest some time in learning basics of UI design; layout, color schemes, supporting accessibility. Even if you know how to create a functional website, it's still a challenge to design that is easy to use, looks good, and assists differently-abled people.

:emptyquote:

Enos Cabell
Nov 3, 2004


Thanks for the feedback! I'll start looking into Typescript before I dive any further into JavaScript.


minato posted:

Finally, invest some time in learning basics of UI design; layout, color schemes, supporting accessibility. Even if you know how to create a functional website, it's still a challenge to design that is easy to use, looks good, and assists differently-abled people.

Any good resources for this, or is it just a matter of checking out various sites to get a feel for what works and what doesn't?

camoseven
Dec 30, 2005

RODOLPHONE RINGIN'

Enos Cabell posted:

Thanks for the feedback! I'll start looking into Typescript before I dive any further into JavaScript.

TS is a superset of JS. You need good JS fundamentals or TS won't do anything for you

minato
Jun 7, 2004

cutty cain't hang, say 7-up.
Taco Defender

Enos Cabell posted:

Any good resources for this, or is it just a matter of checking out various sites to get a feel for what works and what doesn't?
Lots of big companies have Human Interface Guidelines. Read a bunch, but don't take any as gospel. Apple has good HIG docs and explanations that apply to any kind of UI, not just websites.
https://developer.apple.com/design/human-interface-guidelines/macos/user-interaction/data-entry/

Also google "bad ux design" for lots of articles on how not to do it... those can be more instructive.

Enos Cabell
Nov 3, 2004


minato posted:

Lots of big companies have Human Interface Guidelines. Read a bunch, but don't take any as gospel. Apple has good HIG docs and explanations that apply to any kind of UI, not just websites.
https://developer.apple.com/design/human-interface-guidelines/macos/user-interaction/data-entry/

Also google "bad ux design" for lots of articles on how not to do it... those can be more instructive.

Excellent, thanks a ton!


camoseven posted:

TS is a superset of JS. You need good JS fundamentals or TS won't do anything for you

RGR that, I'll keep working on JS

commie kong
Mar 7, 2019

Enos Cabell posted:

Any good resources for this, or is it just a matter of checking out various sites to get a feel for what works and what doesn't?

I found this book to be very helpful
https://www.refactoringui.com/book

You can check out their old blog to get a feel for what the book will be like
https://medium.com/refactoring-ui

Vincent Valentine
Feb 28, 2006

Murdertime

Please note that despite the fact that nobody uses jQuery that much anymore, it's still a great place to start learning about libraries and more advanced DOM manipulation. You can absolutely forget about it after you learn React/Angular/Vue/Whatever, as they have all the functionality of jQuery built in. But it's an excellent first step for someone just getting their feet wet.

Ape Fist
Feb 23, 2007

Nowadays, you can do anything that you want; anal, oral, fisting, but you need to be wearing gloves, condoms, protection.
Seconding the idea that learning jQuery is not 'wasted brain space'. Over the course of your career as an FED you're going to encounter it whether you like it or not and knowing something about it won't hurt. If you work in a house that does ASP.NET 4.5 or lower as an FED you're going you have a bunch of greybeards fistfight you over how jQuery is fine and SPAs are a 'solution without a problem' (In fact you're going to encounter that mentality with a lot of developers over 40, frankly, who think jQuery was/is all JS ever needed to be 'good').

And despite all of the poo poo jQuery gets, to this day no one's really bothered to come up with a nice/good/convenient animation API that works quite the same as jQuery does. I think there's a library out there that extracts the animation functionality of jQuery into some other library but I could never get the stupid loving thing to work the way I wanted it too, so there you go.

LifeLynx
Feb 27, 2001

Dang so this is like looking over his shoulder in real-time
Grimey Drawer
Alright so I built an app using NextJS and with Strapi using a Postgre database. It's all running fine local, now my question is - where do I host it? I'm 90% sure the free tier of Netlify would be sufficient for the front-end, but the database is outside my expertise. I see most people recommend Heroku, but the free tier only offers 20 max connections. I thought that seemed small, but doing some research I think I found that the average Wordpress host only allows that many connections anyway, so if it works there with MySQL databases it should be fine for a small site. Just nervous because the next tier up is $50/mo. and I have no concept of when I'll need bigger infrastructure.

Also, what's the workflow like to having a local development PostgreSQL db and pushing it live? I can use Git to push all my Javascript stuff onto Vercel/Netlify/whatever and have it automatically build and deploy for me, but is there a similar workflow with pgAdmin?

aperfectcirclefan
Nov 21, 2021

by Hand Knit
Put the nextjs app on Vercel. That's what Vercel excells at.

For the database use AWS or digital ocean database hosting. Strapi you could put on a service like heroku for free

Also 20 max connections should be fine because with a nextjs site you should be collecting the data once and then having nextjs run filtration on the data, so essentially you'd use like one connection

For local db development use a program like DBeaver which remotes into the sql server and you can run commands in there

aperfectcirclefan fucked around with this message at 14:30 on Dec 23, 2021

Dominoes
Sep 20, 2007

This is what you need for making web page frontends

Maybe TS too, if you want.

React etc if you're doing something very complicated.

The Merkinman
Apr 22, 2007

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

What is the number (numbers??) how do I calculate it out? Is this for similar things, only of varying color, or only the background color/text color combo.

Basically I'm being told to introduce some background colors as an alternative to white (#F2F7F5 as an example), to break up content on a page. However I, and others, feel that it is too subtle, that people won't even be able to see the difference. So I'd like some sort of objective number I can point to and say "no it's too similar to white, not enough people will see it, so it's an a11y issue. Come back with a different color".

I know such a thing exists for colors of text and its background, but that's not what I'm asking about here.

go play outside Skyler
Nov 7, 2005


Dominoes posted:

This is what you need for making web page frontends

Maybe TS too, if you want.

React etc if you're doing something very complicated.

I’m not one to endorse using React for every little thing, but I honestly couldn’t imagine making any type of dynamic content more complex than a simple menu, carousel, or pagination without it. React itself has a very low footprint … unless you’re using a million other libs.

So I guess it depends what you mean with “very complicated”. React + TypeScript is a really great experience.

Jabor
Jul 16, 2010

#1 Loser at SpaceChem

The Merkinman posted:

What is the number (numbers??) how do I calculate it out? Is this for similar things, only of varying color, or only the background color/text color combo.

Basically I'm being told to introduce some background colors as an alternative to white (#F2F7F5 as an example), to break up content on a page. However I, and others, feel that it is too subtle, that people won't even be able to see the difference. So I'd like some sort of objective number I can point to and say "no it's too similar to white, not enough people will see it, so it's an a11y issue. Come back with a different color".

I know such a thing exists for colors of text and its background, but that's not what I'm asking about here.

If there is currently no colour distinction at all, then introducing one isn't going to be an a11y issue no matter how subtle it is. It just means you'll need to watch for potential a11y issues if part of the design starts relying on users being able to tell the colours apart.

Dominoes
Sep 20, 2007

React will always have VDOM overhead, and is a DSL. Addressing performance when using it is is tough. Fundmantally, it and other frontend frameworks, are built without performance as a project requirement, which IMO is a dire mistake.

fsif
Jul 18, 2003

Right but many React frameworks just compile down into static HTML.

Dominoes
Sep 20, 2007

Can you post an example?

Roadie
Jun 30, 2013

Dominoes posted:

Can you post an example?

Next.js, already mentioned a few posts above, is the obvious one. It's designed to turn as much as possible into static HTML, either at build time or by later rendering pages on demand and caching them across deploy cycles.

Dominoes
Sep 20, 2007

Nice. Step in the right direction.

The Merkinman
Apr 22, 2007

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

Jabor posted:

If there is currently no colour distinction at all, then introducing one isn't going to be an a11y issue no matter how subtle it is. It just means you'll need to watch for potential a11y issues if part of the design starts relying on users being able to tell the colours apart.

We have 2 colors already, this is a 3rd and one of the original ones is tentatively changing to something more subtle.

I just want to make some case of "the average visitor isn't going to notice this color compared to white because they aren't on a 5K iMac with studio lighting."

minato
Jun 7, 2004

cutty cain't hang, say 7-up.
Taco Defender
Show them their demo image on a low-end mobile device with brightness turned down halfway.

Lumpy
Apr 26, 2002

La! La! La! Laaaa!



College Slice

Dominoes posted:

React will always have VDOM overhead, and is a DSL. Addressing performance when using it is is tough. Fundmantally, it and other frontend frameworks, are built without performance as a project requirement, which IMO is a dire mistake.

If your project is getting large enough to have performance problems, your vanilla JS project will either also be having them or have gotten so complicated you’ve effectively created your own framework anyway.

LifeLynx
Feb 27, 2001

Dang so this is like looking over his shoulder in real-time
Grimey Drawer
Figuring out how to deploy this Next.js + Strapi + PostgreSQL stack feels like hopping into the cockpit of a space shuttle and trying to do a lunar landing. But there was a time not so long ago that I shied away from doing any CLI stuff because "What do you mean there isn't an .exe I can just download?" Now I've got it mostly figured out; the trick was decoupling everything in my head, because I'm used to "Wordpress is the frontend is the CMS is the database" Holy Trinity style development. I could use Wordpress, but it doesn't seem possible to filter based on Advanced Custom Fields.

Next.js is on Vercel. I was doing this anyway with static sites, so this was easy.
Strapi is on my local machine for right now, and it can connect to the database. Seems like I could host this on a $10/month Digital Ocean droplet.
The DB is on Heroku. I need to figure out how to set up permanent credentials using Heroku, because the ones they give you change every so often unless you set them up the way they want you to.

I need to figure out a way to sync my local database to the one on Heroku/Digital Ocean, if that's possible, the same way I can develop the Next.js part on my local machine, push to Github, and have Vercel build it automatically. Strapi doesn't have an export/import or data backup, and the only plugins that did that aren't compatible with the latest version.

aperfectcirclefan
Nov 21, 2021

by Hand Knit
Download DBeaver for the database and it can remotely connect to the DB on Heroku.

teen phone cutie
Jun 18, 2012

last year i rewrote something awful from scratch because i hate myself
man github actions is so cool. being able to publish a package to NPM and have people manually approve before the publish happens all within github is so nice to have.

Verisimilidude
Dec 20, 2006

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



First off, I wanted to thank everyone in this thread, particularly those of you who reached out with critiques of my personal site. I worked on it a bit more and since then I've started getting exponentially more responses for my applications, several of which coming directly from my site. I've since accepted a generous offer at a new company and will be starting my second web development position later this month.

edit: Closed!

Verisimilidude fucked around with this message at 17:50 on Jan 24, 2022

Splinter
Jul 4, 2003
Cowabunga!
An experienced developer that also has PM and/or BA experience for 80-100k and no equity is crazy IMO. That's already low for just a dev, but BA or PM experience is a huge value add over just dev skills at many companies.

fawning deference
Jul 4, 2018

Verisimilidude posted:

First off, I wanted to thank everyone in this thread, particularly those of you who reached out with critiques of my personal site. I worked on it a bit more and since then I've started getting exponentially more responses for my applications, several of which coming directly from my site. I've since accepted a generous offer at a new company and will be starting my second web development position later this month.

Secondly, my company is now looking to hire a replacement for my current position. You can view the listing here on Angel or here on LinkedIn

We are open to new developers looking for their first position as well, so do not be shy. If you do apply, please do so through either the Angel or LinkedIn link and shoot me a PM or email at john @ finteractions dot com to let me know and I will push you up through the process.

Great to hear! I just PMed you.

Nolgthorn
Jan 30, 2001

The pendulum of the mind alternates between sense and nonsense
Can someone help me figure out http2, it looks like an interesting technology and I want to write my next app using it. I understand there's a "compatibility layer" so that you can use it while continuing to write apps "the old way" but I'm interested in the new way.

https://www.sohamkamani.com/nodejs/http2/

The above guide is one of the only resources I've found on the topic that doesn't say "use express and bastardize the framework even more." My intent would be to write an app in node with an accompanying client side app. My understanding of one of the primary benefits of http2 is that it's a persistent connection between the client and server. So I want to load my html and have that act as a persistent connection.

But that doesn't seem to be right.

It seems like I need to load the html the "old way", then from within my client side code create a persistent http2 connection from which I can make any further requests. But then, I don't understand what I'm supposed to do such that all of my resources like css or js or images are loaded through it. It seems like first page load along with whatever is on the page is all still loaded "the old way."

Like, how can I create a http2 connection, without having my javascript file loaded for example. Isn't the browser supposed to handle a lot of this?

Additionally, server side. I got pretty comfortable with the fact I could set and then change headers at will using `setHeader()` before they'd all be sent out at once after I was ready to start writing the body of the response. But with the new implementation, whenever I get my hands on a stream instance, it seems like my only option is to write a header or not. I can't overwrite it, for example. It just sends it out right away. Am I not getting it?

Additionally, now that http2 is all binary does that mean I need to do a bunch of manual stuff with the responses once it gets client side? The old way always expected text. So now I need to convert everything, like JSON for example, before I can parse it?

I feel like I've confused myself more than I've helped myself over the last week trying to get to the bottom of all this.

Nolgthorn
Jan 30, 2001

The pendulum of the mind alternates between sense and nonsense
After a bit more experimentation I was confusing the client side implementation that you would put in the browser with a client side implementation on the server. In fact because http2 requires use of ssl, the pre-flight handshake informs the browser that it's http2 and it does in fact handle a lot of this stuff after that. So you can basically build a web app without thinking too much about it.

The structure of your server side code is quite different as long as you aren't using the compatibility layer. But it also looks a lot easier too, working with binary all the time for example makes things much clearer.

aperfectcirclefan
Nov 21, 2021

by Hand Knit
Few questions...I haven't used React in a while.

1. Have people transitioned to Hooks exclusively or is it worth still using Redux?
2. Is it possible to do a switch case in JSX for conditional rendering?

Thanks

Roadie
Jun 30, 2013

aperfectcirclefan posted:

1. Have people transitioned to Hooks exclusively or is it worth still using Redux?

The answer is "mu", because this isn't an either/or.

Verisimilidude
Dec 20, 2006

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



aperfectcirclefan posted:

Few questions...I haven't used React in a while.

1. Have people transitioned to Hooks exclusively or is it worth still using Redux?
2. Is it possible to do a switch case in JSX for conditional rendering?

Thanks

In our current tech stack we're planning to switch away from redux and go with pure hooks. It seems the best way to go for configuration reasons. We're currently using a redux and redux saga layer in our mobile app and it causes some issues with functional components, which ultimately means we need to resort to class components throughout major sections of the app.

I love redux so much, but if it means having more options I can see hooks being my go-to for all future projects.

Adbot
ADBOT LOVES YOU

minato
Jun 7, 2004

cutty cain't hang, say 7-up.
Taco Defender
I thought the push for pure hooks was to get away from class-based components, which vastly improves maintainability and composability. Redux seems to address an orthogonal concern, but I'm no expert.

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