teknologi-umum / blog Goto Github PK

Halo, maintainer.

Aku kemarin baca artikel kalo blog nya mau di terima adsense, ada berapa hal yang perlu dipastiin.

• Responsive (mobile friendly)
• Punya halaman Privacy Policy, Term of Use, Disclaimer

Contoh web:

• Nesabamedia

Referensi:

• Dewaweb

Make it centered on smaller screens

Simple. Translate this Figma design into the web page: https://www.figma.com/file/0h7q7YktHjNxmj922pre2j/Teknologi-Umum-Blog?node-id=0%3A1

Part 1:

• Dependency injection
• Repository pattern

Part 2:

• Encapsulation
• Data validation
• Wrong DRY practices

Part 3:

• DDD
• Clean architecture

Part 4:

• Blazor

Part 5:

• Microservices

Part 6:

• Orleans

this's what the browser console said

and this's the errors

The "Browse the repository" button shouldn't be clipped like this, the layout could be better:

Because this is a blog, and our analytics shows that there's not much traffic going through the site, we can probably enhance it further by putting an RSS feed for people to consume.

There are already so many articles explaining how to create that with Next.js:

• https://sreetamdas.com/blog/rss-for-nextjs
• https://blog.logrocket.com/adding-rss-feed-next-js-app/
• https://www.davegray.codes/posts/nextjs-how-to-build-an-rss-feed
• https://www.jamesshopland.com/blog/nextjs-13-rss-feed

I get this console error whenever I open a blog post with cookies disabled:

framework-2191d16384373197bc0a.js:1 
DOMException: Failed to read the 'localStorage' property from 'Window': Access is denied for this document.
    at R (https://teknologiumum.com/_next/static/chunks/pages/posts/%5Bslug%5D-403e3460e620a95d45a6.js:1:22273)
    at ro (https://teknologiumum.com/_next/static/chunks/framework-2191d16384373197bc0a.js:1:60216)
    at Hu (https://teknologiumum.com/_next/static/chunks/framework-2191d16384373197bc0a.js:1:112674)
    at Pi (https://teknologiumum.com/_next/static/chunks/framework-2191d16384373197bc0a.js:1:99848)
    at xi (https://teknologiumum.com/_next/static/chunks/framework-2191d16384373197bc0a.js:1:99776)
    at _i (https://teknologiumum.com/_next/static/chunks/framework-2191d16384373197bc0a.js:1:99639)
    at vi (https://teknologiumum.com/_next/static/chunks/framework-2191d16384373197bc0a.js:1:96605)
    at https://teknologiumum.com/_next/static/chunks/framework-2191d16384373197bc0a.js:1:45984
    at t.unstable_runWithPriority (https://teknologiumum.com/_next/static/chunks/framework-2191d16384373197bc0a.js:1:130375)
    at Wl (https://teknologiumum.com/_next/static/chunks/framework-2191d16384373197bc0a.js:1:45761)

Solution:

Check whether we can use localStorage or not before using it

For now, I think we have 2 good contenders:

Reference link on Google Domains: https://domains.google.com/registrar/search?searchTerm=teknologiumum&hl=en&tab=1&sort=2

Why teknologiumum instead of teknum? Well, to be honest, I don't really recognize what teknum is. It's easier for people to understand teknologiumum rather than teknum.

Easier to remember beats shorter domain name.

cc @lamualfa @elianiva @artileda

• intermediate sql materials (inner join/outer join, dll, transaction, subquery)
• apa itu deadlock dan gimana cara hindarinnya
• git flow, gimana cara kerjanya, benefitnya apa

this is just a proposal, if you have a better idea, please do let us know

.
├── src
│  ├── routes               - Literally the pages
│  ├── layout               - Oh come on
│  ├── components           - Reusable components
│  ├── lib                  - Internal libraries
│  └── utils                - Utilities
├── content                 - Markdown files, categorized by year
│  ├── 2021
│  └── 2022, and so on forth
└── static
   └── images               - Pictures/screenshot (if any) to be referenced. 

cc @elianiva

kayaknya aku gabisa ngoding sampe pertengahan minggu depan, banyak kerjaan mulai numpuk lagi

Currently we have GitHub, Telegram, and Twitter on every author card just below the author's name in every blog post.

Now since some people are moving to Mastodon to expand their audiences, or because some people prefer Mastodon as it's more FOSS than Twitter (or for whatever reason), we should support it.

We should add another prop on the AuthorCard component, the value should be @username@host. For example: @[email protected]. The link then should be parsed to https://hachyderm.io/@mustafasegf.

One edge case: It should also handle multiple @ (at) points. Like @[email protected]@social.gnuweeb.org, it should be parsed to https://social.gnuweeb.org/@[email protected]

Shouldn't be that hard.

• Use http://mdsvex.com/ instead of regular markdown
• Use https://github.com/svelte-add/svelte-add if you want an easier route
• Create /blog route filled with .svx files
• Don't worry about making it look good, we need the functionality first

See this repo for reference

I want to use the carbon alternative (graphene) but I forgot the app name, so it can be helpful if any page that shows a list of projects from title, description, & screenshot (if needed)

Maybe the repo name should change to "website" if this feature approved

Current featured post is a placeholder. Replace this with the latest post (by date) from the list of articles.

• use Supabase's Postgres to store data (I'll sign up for that later using the org's email)
• use Prisma (don't know if its gonna be overkill or not lol) or just regular pg-promise
• use Vercel's serverless function to create the API

Currently, user will see light mode for a split second before the dark mode applies on page reload/visit. The reason is there’s a pause after user visits the page until the dark mode script runs.

There’s probably an off-the-shelf library that takes care of the flash like next-themes. Or since we already have the logic for setting dark mode, the final stretch is to move it to a <script> tag before the <body> as outlined in https://hangindev.com/blog/avoid-flash-of-default-theme-an-implementation-of-dark-mode-in-react-app

implement this: https://giscus.app/

why Github Discussions over Github Issues? biar rapih aja. let discussion be discussion and let issues be the place to report bugs and talk about the source code rather than the blog contents

cc @lamualfa minta tolong di install ke repo ini ya pak

Please add the darkmode mode , because the lightmode is a bit dazzling in the eyes

List of people who give financial aid to Teknologi Umum through GitHub or Saweria.

Part 2:

• O(1), O(n), O(n^2), O(n^3) in real algorithm
• Deep dive into O(log n): O(n) to O(log n) optimization (binary search, interpolation search)

Part 3:

• Deep dive into O(1): hash map, hash table, bloom filter, programming challenge that can be solved in O(1) using math

Part 4:

• Sorting algorithms, database indexing

As shown below, it's not eating the full width of the image container, making it look a bit weird. Should be a simple CSS fix.

We're using Next v12 with Node v16 currently, which is pretty old. We should migrate to newer version of next and bump the version of the rest of the dependencies that we use to make the blog up and running.

Currently the post card displayed is uneven. This is because there are different amount of topic badges. Ideally they should all have the same height.

Several possible solutions:

• limit the topic badges, eg: max 2 badges for each post card
• make the card height to be the same, although the result may look awkward since there will be too much empty space
• make the topic badges horizontally scrollable
• etc

Redirecting to a URL that is constructed from parts of the DOM that may be controlled by an attacker can facilitate phishing attacks. In these attacks, unsuspecting users can be redirected to a malicious site that looks very similar to the real site they intend to visit, but which is controlled by the attacker.

Recommendation

To guard against untrusted URL redirection, it is advisable to avoid putting user input directly into a redirect URL. Instead, maintain a list of authorized redirects on the server; then choose from that list based on the user input provided.

Example

The following example uses a regular expression to extract a query parameter from the document URL, and then uses it to construct a new URL to redirect to without any further validation. This may allow an attacker to craft a link that redirects from a trusted website to some arbitrary website of their choosing, which facilitates phishing attacks:

window.location = /.*redirect=([^&]*).*/.exec(document.location.href)[1];

References
OWASP: XSS Unvalidated Redirects and Forwards Cheat Sheet.
Common Weakness Enumeration: CWE-79.
Common Weakness Enumeration: CWE-116.
Common Weakness Enumeration: CWE-601.

security alert from codeql

select itu apa. kita harusnya bisa kopas sekali klik wkwkwk. kontent tentang panduan biasanya bikin gregetan pas kita select wkwkwk.

We'll need this for the post cover image. See #40 (comment)

The rest of the article becomes narrow. This is more apparent in dark mode.

Screenshot from Iphone SE (width 320px)

This is an easy Hacktoberfest PR that would likely be accepted by the Hacktoberfest team. And this should comply with the Hacktoberfest's quality standard.

Simply create a post article about anything, whether it's tech-related or not. Share your knowledge! Tell us your experience of using something! Tell us a story about how you went through a coding interview! Anything would be accepted as long it's not against the law.

A few resource to keep you up and running about Pull Requests:

• Understanding the GitHub flow
• How to advance your career by contributing to open source projects
• How to write the perfect pull request
• How to write a good commit message

How to reproduce:
Screen width <= 375px. the smaller the better.

jadi ane bikin printnya lebih make sense karena sebelumnya white space dan beberapa yg harusnya nggak perlu di print ke print.

ada problemnya:

• gimana caranya biar divnya dibagian postnya nggak kepotong ya. udah coba pakai break-inside nggak mempan (https://tailwindcss.com/docs/break-inside)

• create CONTRIBUTING.md
• create pull request template -- PR without opening up an issue would be rejected, blog post excluded.
• put hacktoberfest tag
• put a few hacktoberfest guides on readme such as:
  • https://twitter.com/sudo_navendu/status/1437456596473303042
  • https://www.digitalocean.com/community/tutorials/hacktoberfest-contributor-s-guide-how-to-find-and-contribute-to-open-source-projects

cc @elianiva @lamualfa

see teknologi-umum/analytics#2

cc @elianiva @lamualfa

Current "browse interesting topics" tags leads to nowhere. Implement the correct search function for this.

For more information about the search feature, try contacting @rubichandrap