Clicks and views #17

Added and styled an Analytics component
Added hooks to get and post click and view counts in Analytics/index.tsx and Link/index.tsx
Added Linktree font (Karla) in tailwind.config.js

Things left to do:

Add endpoints to Analytics/index.tsx and Link/index.tsx and get data from the given object
~~Add onClick={handleClick} to the Links~~ (resolved Mar. 22)

Let's add all the .vs/ files in the .gitignore so others don't have to pull this down

nit: Let's keep component names in TitleCase!

Delete this, there isn't a package.json at the very root level

Always use const when declaring variables, unless you have to perform direct mutation (which is rare), then use let

Good job putting components in diff files, makes the main Analytics file cleaner!

The intention was to declare the viewCount and clickCount variables at the start of the component, and then mutate them in the fetch function inside the useEffect (getting the actual view/click count from the returned json). I can't seem to directly declare const variables in useEffect and then use them. Should I use let or is there another way around this? Thanks!

changed this line in version 2 of the diff

added 1 commit

5b2337a0 - Remove/ignore unnecessary files, rename components

Compare with previous version

added 3 commits

ab544fc7 - 1 commit from branch main
457aa949 - Resolve merge conflicts with new Links component
72c435fe - Add Karla font from Tailwind to Links

Compare with previous version

changed the description

Hmmm so this approach wouldn't work. Direct mutation is generally avoided in React because it's most often a sign of bad practice. Since React only re-renders when state is changed, during the initial render, you will see 0 views and 0 clicks.

When you mutate viewCount and clickCount, even though you've updated the variables, it won't trigger a re-render, so you'll still see 0 views and 0 clicks.

Instead make both into state variables by using useState and use their appropriate setState functions on lines 14-16

changed this line in version 4 of the diff

added 1 commit

3f09aa60 - Add state hooks to get rid of let variables

Compare with previous version

added 1 commit

7228f610 - Change click count documentation

Compare with previous version

Gotcha, thanks!

resolved all threads

approved this merge request

Clicks and views #17

Reviewers