This is why your site might need a cookie banner

📘 T3 Stack Tutorial: 1017897100294.gumroad.com/l/j...
🤖 SaaS I'm Building: www.icongeneratorai.com/
💬 Discord: / discord
🔔 Newsletter: newsletter.webdevcody.com/
📁 GitHub: github.com/webdevcody
📺 Twitch: / webdevcody
🤖 Website: webdevcody.com
🐦 Twitter: / webdevcody

[@voidedname]

To be compliant with EU law, you still have to explain to the user what the cookies are being used for. The banner itself is not enough, you'll probably have to add a link to "details" where you list all types of cookies and or data collection you or third parties are doing and what it is for. You don't have to list individual cookies or collection services. It's enough to claim that you track usage statistics for you to be able to analyze and improve the user experience. (Let's imagine there is one for ads, then you'd have to list that as well... ) Storing the preferences in a cookie is fine, it's required for the site to function. Local storage is also fine, doesn't really matter. That cookie is also not collecting or tracking any data. To be specific, the GDPR (general data protection regulations, the laws in question here) is only concerned with data privacy and use. Cookies, LocalStorage, other trackers and collection mechanisms only need this banner if they do collect such data (like usage statistics, location, etc etc). A "setting" is not tracked data about the user and can also safely be considered as "functionally required for the site to work", it's his preference... there are some grey areas, and if you track the data, but the tracked data is all required for the site to function, then you don't need the banner either. Another thing is, the consent must be freely given. I.e. you can't have "accept or leave the page". And the consent must be withdrawable, which should cause any such cookies to be deleted or provide the user with instructions on how to remove them... and a few more things :)

[@wezter96]

Yeah I have been looking for a guide/tutorial on how to build something like this yourself (without using a paid service) Does any of you know about anything for this?

[@teamvashmmo3218]

Nice addition! That react consent looks easy to add. I've recently been working on my cookie consent stuff and making it all GDPR compliant. I can let you know some more info. It's required by law that every website has a Privacy Policy. You don't need a Terms and Conditions by law but you do need a Privacy Policy if you're processing personally identifiable information (like emails, ip addresses, addresses, names). And in that Privacy Policy, to be compliant with GDPR, you have to mention a few things like what personal data you're processing, why you're processing the data (e.g you let them create an account, to give them the personal AI image they generated), then why you have the legal rights to process (there are a few you can choose from (1) you have consent to process it (i.e cookie consent banner, or they clicked a button to say you can email them marketing news). (2) Contract: if you have a contract with them (if they're buying things you probably have some sort of contract so allowed to process their data under that contract to give them the services they asked for. (3) Legitimate interest: processing data in a way that has minimal privacy impact to your user (e.g to create ads and marketing). (4) legal obligation: you need to process it for legal reasons like the government asked you to hand over the data. (5) virtal interests: gotta process it to save someone's life. Then you have to mention their rights and choices when it comes to processing the data. You can find more info on what you need here gdpr-info.eu/ and this one here (I like this one ico.org.uk/for-organisations/guide-to-data-protection/guide-to-the-general-data-protection-regulation-gdpr/). With your current consent banner, it looks good as a starter, but it doesn't allow people to be able to change their choices later (they would need knowledge to delete a cookie or something). Usually it will have a "manage your preferences" option. Personally I use Klaro (an open source cookie consent banner) as it also lets you let people manage their preferences later and also individually choose which cookies they want to allow and which ones they don't. It also lets you list "essential cookies" which are cookies that cannot be turned off as you need them to give them a service or let your website function (e.g cookies for stripe, letting them stay logged in or a shopping cart cookie). But you could just add a "manage your preferences option" and make it allow them to change their choice somehow? Up to you! I hope this helps! Let me know if you have any other questions as it's all fresh in my mind right now :D P.s I think it's normal to use a cookie to store a users preferences (most sites seem to) because it's not personally identifable information, it's just a yes/no boolean. And it's okay to have essential cookies for the site to function and you need that cookie to determine their consent lol.

[@WebDevCody]

Thanks for all this great info!

[@felipeleon6631]

Congrats on 100k cody!! very useful channel, lots of value

[@armant11]

I was looking for exactly this! Hoping to see a longer video on cookies in next js. 👍

[@joshtriedcoding]

Great implementation. There’s a couple details that are important for compliance, e.g. allowing users to decline on the top-level. As a EU person, I found the approach of (I believe it was) Firefox very interesting, as I’m pretty sure they’re going to auto-decline Cookies in the future to prevent a popup on almost every website

[@WebDevCody]

What do you mean on the top level? Like the first page of your site?

[@joshtriedcoding]

@@WebDevCody So, if you provided the options of "I accept" and "more options" for example, the user would have to click on "more options", then select which cookies they opt-in for, and then click "save settings". Pretty sure there was a verdict forbidding that, meaning you'd have to provide a "I decline" option right away

[@damjandjordjevic1994]

@@joshtriedcoding Oh, I'm so glad to hear that. There are already tools that hide the cookie banner, but being able to auto-decline is gonna be great. That was the primary reason for the law anyway. Only the users that WANT to be providing data should be tracked. It turned out that everyone clicked "I Agree" just to get rid of a 50% vh banner :p

[@brymstoner]

@@damjandjordjevic1994 i'm pretty sure this was always the intended interpretation. but companies have continuously pushed back with dark patterns and super cookies, etc. if you ever want to know what dirty techniques the industry deploys in this space, just look at what facebook is doing. they've essentially lead the way for years.

[@SeanCassiere]

Depending on how deep you want to your analytics to go, there are some privacy-focused alternatives out there that aren't in a blackbox. Some of the options are, Plausible (does it without collecting cookies) and Umami.

[@WebDevCody]

Thanks I’ll check those out!

[@brymstoner]

local storage is the route i went with. been doing it this way since 2014. it's so much easier. chrome does mislabel it as a cookie though. and it's definitely not a cookie. it's better than. i use it to determine whether or not different aspects of the sites are available based on whether the user permits it or not. and they can change their minds and revoke that consent easily at any time with a simple footer-based callback. heads up, though, cody... google is extra sneaky, slipping in various local storage "experiment" objects alongside their cookies if the user does permit and later decides to change their mind. quickly descends into a game of "experiment" whack-a-mole!

[@SeibertSwirl]

Good job babe!!!

[@hanes2]

Theres good alternatives to google analytics that does not require either cookie banner and is GDPR/EU legal. One way is to get your domain provider managed by one that also provides analytic statistics. Then it’s not tracking users either, just anonymous data. What end points get hit, how many users, most popular browser and all that An GDPR accepted alternative is Fathom Analytics.

[@mishikookropiridze]

I did similar thing, but without any depedency, also i stored cookie consent to backend as wel for authenticated usersl. Does it make sense to store it in db? not sure.

[@xelion7110]

thanks for the video ,however im struggling to find the right hosting provider would you please tell me where did you host your production project or do video about it

[@WebDevCody]

I still use aws with sst now

[@xelion7110]

@@WebDevCody ty

[@mido9528]

Can you make a video about how the data is presented on the google analytics?

[@kevinfriedman6766]

if you have GA questions, look up Simo Ahava, he's the GA GOAT

[@astr0-g]

should we create a analytic db ourself? or it is to safe using google analytic in general, or there are other provider on the market?

[@WebDevCody]

Doing it yourself wouldn’t be too hard, but it won’t track everything out of the box like an analytics service will

[@Gbw99]

interesting subject :) keep going dude

[@johnsanchez8429]

What’s the extension that shows the hex colors on top of the hex codes

[@bigmistqke]

1:45 🙏 for storing it in a cookie if u already pushed that button. So so so many websites keep on showing that cookie-banner on every visit, extremely frustrating.

[@Kevin-fl4rn]

Theres new US laws like CCPA and GDPR that will be requiring banners like this as well. You can still use first party cookies you just need consent for third party I believe

[@teamvashmmo3218]

CCPA is for California residents only if you meet these requirements: Have $25 million or more in annual revenue; or Possess the personal data of more than 50,000 California “consumers, households, or devices” or Earn more than half of its annual revenue selling consumers’ personal data.

[@Kevin-fl4rn]

@@teamvashmmo3218 yep, also the CPRA. Point is many states in the US are starting to enact things similar to GDPR and it'll only continue to grow

[@universe_decoded797]

I know its weird when you decline it will be stored in the cookies, but big companies like Microsoft and other ones I can’t remember do this as well so it doesn’t really matter. They won’t fine you for that

[@shadowplay1211]

What's the extension that displays all the git changes right in the editor?

[@IStMl]

love how he liked the comment but never answered

[@shadowplay1211]

@@IStMl 💀

[@Chenny0]

Plausible analytics is amazing so far

[@dabrahgo]

For a site with global reach, does banner have to address all countries/laws?

[@dabrahgo]

I guess the answer is yes, but how 🤔

[@maxzakh]

Can you share the github repo?

[@ESArnau]

But since you are from the US, what can happen? Some EU authorities report you and subpoena you in a european country? Im really curious.

[@WebDevCody]

I’m not sure, probably nothing. Probably depends on how much traffic or money you make from Europe customers before they’d consider doing anything

[@user-up7dp9ki2o]

Is cookie concern banner popup mandatory for AdSense approval ?

[@WebDevCody]

If Adsense uses cookies for anything, then yes probably

[@coolemur976]

Do you have to explain each cookie usage in cookie policy page ? Do you have to provide more options to users: to pick required cookies, tracking cookies, ad cookies, etc. ? Do you have to store their consents somewhere so that you have a proof that some actually agreed with usage of cookies ? I hate this law. And how people deal with this law. This should be done in browsers scope, not each web app scope (waste of time and money of ppl + annoying popups).

[@WebDevCody]

I think if you have a lot of third party cookies you need a page where they can configure which ones they want, accept all, or deny third party cookies

[@i7920c0]

Cookie consent is not really about the cookies themselves, but what they're typically used for. You don't need to ask consent for/explain things like login tokens, dark mode preference, etc. You do need to inform, and ask consent for, tracking cookies and the like as this falls under GDPR. (this consent must be freely given, specific, informed, and unambiguous - so no dark patterns) You must not deny general access if they don't accept these consent-required cookies. Some of your site features may require these cookies, in which case you'll want to add an option to customize, or ask for consent just prior to their usage of that feature. Some (most) changes will require you to re-ask for consent, such as if you were to start sending data to yet another third party. Legally, you have to record who consented, when, how, and what they were told. Users must be able to later change their preferences. Don't hate the law, hate just how normalized tracking and selling your personal information is. This could be handled in the browser scope, and was implemented in the form of "DNT" (Do Not Track), but it was rarely respected/adopted, so it's basically just dead now. en.wikipedia.org/wiki/Do_Not_Track

[@coolemur976]

@@i7920c0 I like your reply, precise information 👍 . Just imagine that you have to implement storage in your static website only because you need to store consents… I think there should be some kind of “default”. For example, every site has your consent by default like the good old days. Because now we have tons of websites, that imitate these popups without really complying to GDPR. For example, even if you pres “don’t track”, they still do. Or if you would ask for a record that you did agree, a lot of websites wouldn’t provide it, just because they don’t store that data. Storing data = $.

[@nilsbosman]

Have you tried alternatives to Google Analytics like Fathom Analytics or Plausible Analytics? You don't need consent for those services so you'll always collect data - they do cost money though

[@WebDevCody]

I have not, I like the free stuff 😆

[@galactusclb5733]

Do some SEO optimization video

[@walterfairfax6043]

Pretty sure cookies / localStorage API is considered the same thing in the GDPR guidelines. Also, storing a cookie to remember when an user denied them is not compliant. You could consider adding an option to remember cookie preferences in their account settings, but that would require an explicit action on their part.

[@WebDevCody]

So then they’d get that banner every single time they load the page unless they are logged in? That’s a pain if so

[@xeliqa3921]

@@WebDevCody its a UX pain, but a benefit for you wanting the user to comply with cookies so you can use things like google analytics. I almost always decline cookies, and continuously have to keep doing so. Like everything, its a trade off. Annoying for the user ? Or potentially unable to track / make insightful decisions for your business / website

[@shadowplay1211]

​@@xeliqa3921 "accept all cookies" and "customize cookies" buttons: let us introduce ourselves 💀

[@elmalleable]

​@@WebDevCody yup that's why the famous cookie meme

[@teamvashmmo3218]

I don't think this is true as you are allowed to have essential cookies which are cookies you need to allow your website to even function. E.g account cookies so a user stays logged in, shopping cart cookies to remember what they put in their shopping cart while navigating pages. I believe a cookie consent cookie falls under that category of essential. Almost all sites have it like that. You gotta store their preference somewhere!

[@venicebeachsurfer]

Do US ONLY websites need a cookie banner?

[@WebDevCody]

I don’t think so. Ask chatgpt, but I’m pretty sure this is a Europe only thing, although if you think about it, it’s kind of nice to let your users know you’re tracking them in some way😉

[@AdisonCavani]

Just use reverse proxy to make data anonymous and get rid of the annoying cookie banner

[@kokalti]

Why do we have to be concerned about European laws if we live in the states? How are their laws governing us?

[@WebDevCody]

I’m not a lawyer, but i technically don’t think you need one if your company is in the US. I know California has some requirements about disclosing cookie use, and I’m assuming other states may slowly adopt it in the future? Can the EU fine you if you don’t have a banner and you live in the US? I doubt it

[@aian-dev]

IMO you might need to add some sort of a geolocation service based on the visiting user's IP address. This way if the visiting user is not from EU (or generally other places with lighter data privacy regulations) you can just remove the accept/decline button on the banner and change the verbiage stating that the site is using cookies blah blah. This way you can maximize the usage of google analytics since users from non EU countries are opted in by default.

[@PpVolto]

That does not work since he can use a VPN but is from the EU

[@vigigamehacker123]

@@PpVolto if someone from the EU wants to use a VPN to appear as in another country that is not the responsibility of the website. They can use VPN servers located in EU if they want to retain this control

[@PpVolto]

@@vigigamehacker123 Yes that is true but when a user travels outside of the EU and whats then? The only way to never run in that problem is to have two sites. one that targets Person from the EU and one that does not. When someone access the none EU instance from the EU show a Geoblock Information. Someone access the EU Instance from outside the EU show them the side or geobock, but geoblocking from outside the EU makes no sence. Thats why most say OK i block access from the EU or use the EU instance for everyone.

[@WebDevCody]

Right, but I mean they have a good point imo. Google will track everything you do and it is probably better to just opt people in if they don’t care

[@ChrysusTV]

This easily gets you in violation of GDPR and is terrible advice. GDPR applies to ANY LEGAL RESIDENT OF EUROPE not someone LOCATED IN EUROPE. They could visit your site from Mars and you could store the data on Jupiter and GDPR would apply to them if they have registered domicile in Europe. It is simply not possible for you to know which country's or organization's laws any given user is protected by, so it will never be possible for any system that conditionally seeks (or foregoes) consent based on geolocation to be compliant.

[@brunosilva-ed4pz]

Oh, so this annoying af banner thing is cause of europe? FFS...