wip: v0 infinite scrolling

[Nabhag8848]

What kind of change does this PR introduce?

• Infinite Scrolling

Issue Number:

• Closes ✨ Enhancement: Implement Infinite Scrolling (Lazy Loading) #1430

Screenshots/videos:

https://drive.google.com/file/d/1CFgrQW9PksBX7Y5RT4DX51czhqSAYDO9/view?usp=sharing

Summary

• Blog post getting load all at once, now its loading as scroll

Does this PR introduce a breaking change?

• In Discussion

[github-actions]

Welcome to the JSON Schema Community. Thanks a lot for creating your first pull request!! 🎉🎉 We are so excited you are here! We hope this is only the first of many! For more details check out README.md file.

[codecov]

Codecov Report

All modified and coverable lines are covered by tests ✅

Project coverage is 100.00%. Comparing base (219521e) to head (d291d34).

Additional details and impacted files

@@            Coverage Diff            @@
##              main     #1510   +/-   ##
=========================================
  Coverage   100.00%   100.00%           
=========================================
  Files           10        10           
  Lines          396       396           
  Branches       106       106           
=========================================
  Hits           396       396           

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

🚀 New features to boost your workflow:

• ❄ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
• 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

[Nabhag8848]

@DhairyaMajmudar @benjagm few questions:

• Currently we have static export and that is avoiding us to have an api endpoint ? Is this intentional.

to have endpoint we need to remove 'output': 'export'. reference - https://nextjs.org/docs/pages/building-your-application/deploying/static-exports

• I have used react-intersection-observer, is this fine ? was there any other expectation ?

Still I need to refine but this is v0 which works.

looking for suggestions.

[DhairyaMajmudar]

Thanks @Nabhag8848 for the PR, regarding your questions

1. Yes 'output': 'export' is kept intentionally as we need to keep the website client side, which further saves the server costs.
2. Instead of introducing /api directory you can follow https://nextjs.org/docs/pages/building-your-application/optimizing/lazy-loading.