Javascript not implemented in Rails version 7 project - javascript

I have a major problem in my rails project. Some javascript files located in the app/assets/javascripts directory are not being implemented.
More specifically, i'm implementing the project from https://www.freecodecamp.org/news/lets-create-an-intermediate-level-ruby-on-rails-application-d7c6e997c63f/
My github repository for the project is https://github.com/nknts33000/Rails/
The last commit where i'm stuck on this project is commit "Add a popup window to show a full post's content",where you use a js pop up window to see the posts from different users.
Sometimes when i run the project, i don't even get the posts from different users on the front page. And sometimes when the posts are showing,nothing happens when i click on them.
Any ideas what's going on?
my page so far

Related

Is there a reason as to why my locally hosted images aren't displaying on my site after uploading everything on GitHub?

o I am brand new to Github, and frankly to programming in general. I created my own portfolio website (following a Youtube guide) and have been facing so many issues trying to understand terminals and then getting it up on Github, but I must learn Github so it's worth learning it even though there are other options to post your websites onto. But after getting everything on my repositories, everything looks normal when I look at the code but when I open my website hosted on GitHub called tyler-104.GitHub.io (my portfolio website), all my images that are local to my computer won't display.
My images that aren't local are displaying ( I have one for github and one for LinkedIn) and work as they should. I thought that I simply only had to upload my local images that are also inside my HTML code to my repositories would solve it, but it does not.
If you look at my site
(tyler-104.github.io)
none of the bigger images are being displayed even after uploading my local files to my repository (https://github.com/Tyler-104/tyler-104.github.io). More than that I have tried and created multiple repositories, uploaded, altered, and updated but nothing seems to work. My only guess is that since they are local they won't display.
Do you need to somehow use images that are already stored online to make it work? Basically, would I have to remove my locally stored images (that are on my Desktop for example) in my HTML and use internet links that I want to display on some sites like Unsplash? Or can I use local images stored images and they will still be displayed?
The console of the developer mode is full of 404 for URLs like:
GET https://tyler-104.github.io/img/3D/Grapes.webp: 404
^^^^^ ?
But your repository does not have a img folder. It directly has 3D/Grapes.webp.
So might need to create img, and git mv 3D img/ in it (the commit and push), to test if those images are displayed.

NextJS calling dynamic page on production redirects to root

What I want
User enters https://www.example.com/test, user gets content of NextJS dynamic route /test/index.js.
This works locally.
What happens
User enters https://www.example.com/test, user gets content of root page (index.js).
The browser still shows https://www.example.com/test but it's not the content of /test/index.js. This only appears on production.
Infos
Deploying to Firebase Hosting.
The root of the problem was, that I was exporting the NextJS application and using the output as source files for Firebase. The solution for my specific problem was, to set up Firebase functions to really enable serverside rendering instead of displaying served static files. This also solved my routing problem.
I found tutorials to be very misleading, once everyone uses different folder structures and ways to deploy the application.
If you are facing the same problem, feel free to check out my repository. It is a combination of the Firebase config, package.json and server file working together - taking in account different folder paths for exporting for development and production.
These resources were helpful to me:
Overall Tutorial: https://itnext.io/deploying-next-js-app-to-firebase-functions-eb473791d79e - This is missing some steps regarding function names.
Great for understanding what each file does: https://github.com/jthegedus/firebase-gcp-examples/tree/master/functions-nextjs
Nice for understanding ways of rendering: https://codeburst.io/next-js-on-cloud-functions-for-firebase-with-firebase-hosting-7911465298f2
This made me understand how to use Firebase function names correctly: https://github.com/vercel/next.js/tree/canary/examples/with-firebase-hosting

How to upload Twitch panel extension in Twitch extension store?

I recently created a twitch panel extension and I have no idea how to upload it and make it available for install. I have seen Twitch extension documentation and I did not find how to upload the extension. If anyone knows how to do it, please share your knowledge.
This is documents I have seen https://dev.twitch.tv/docs/extensions
right now i am stuck here and have no idea where to next from here
A Twitch Extension comprises of HTML/JS/CSS and any background images.
So you'd need to create a zip file that contains your front end assets. In this case that would appear to be the contents of extensions-hello-world/public
Also that looks like a REALLY old Version of the developer rig. You may need to manually update https://dev.twitch.tv/docs/extensions/rig as on older version broke it's auto update mechanism
Assets and the full control time line for a extensions is at https://dev.twitch.tv/console/extensions
A similar question was asked and answered on the Dev Forums: https://discuss.dev.twitch.tv/t/solved-404-the-specified-key-does-not-exist/11921/2
The salient point for the post describes how to select and zip you files. Select all the files in the folder and zip from there. Don't right click and zip the folder itself.

Find and Run Application on PC

I try to figure out how to find and run an application on the users pc when you click a button on the website. I saw this feature on the Unity Assets Store Page. When you click there the Add to Downloads Button the Asset will be opened in Unity. Now I try this too. Therefor I searched a bit and find out that you can do this with HTA? But I only found how to run a specific application like notepad but what is when i dont know the application path. How can I do that?

Listing folder content with React-Router

I am building a "product documentation" web application using React. The application just sits on a shared drive, the user opens index.html and browses the docs. I use React and Bootstrap for getting a nice menu/tree etc. I have client side code, only.
I also have a bunch of PDF-s organized nicely into folders. The number of files will grow over time. I want the user to be able to browse among the files. I would be happy to have an ordinary anchor tag that opens the appropriate folder in Windows Exporer. This actually does the trick:
<a href="./folder_i_want_to_display/" >My product docs</a>
However, since I use React Router, the link does not pull up Windows Explorer anymore. Do you have any suggestion?
Browsers:IE10 and 11 only.

Categories

Resources