How can I fix the hyperlink issue with my React website? - reactjs

I have been looking into this for several months now, and I am finally asking everyone here...Why is this hyperlink not showing my <meta og:image />.
https://www.spragginsdesigns.com
I have messed with this so much I am out of ideas. I've tried many resized images as well. I have tried several file formats and it goes on.
Can someone please let me know what I am wasting my time on and now yours?
Here is the index.html code:
Code is in /src

Related

My images are not displayed on localhost:8000

I'm working on a React website code with gatsby and Visual studio code however I don't understand why none of my images are displayed when I view my site on localhost:8000 a question mark in a square is displayed. Can anyone explain this? I'm a beginner at the moment so I can't find anything...
I wonder if it's because I added my image file from my Finder without changing anything in the code but I don't know how to do it
So if anyone would be kind enough to help me that would be great! Thanks
Sorry for my poor French English 😅
[gatsby][1] [index][2] [button][3]
[1]: https://i.stack.imgur.com/GvXgQ.jpg
[2]: https://i.stack.imgur.com/kohQJ.png
[3]: https://i.stack.imgur.com/r5XeA.png
If you use images from external sources make sure to include the complete image URL inside of the source of the image.
If you use the HTML <img> tag to create a simple image you can see how to do it here. The problem with the HTML image is this isn't very efficient and costs performance.
Because you are using Gatsby you can use various image plugins that are more optimized compared to the img tag. You can use this plugin if you want.
Without seeing your code I can't really help you, but I hope this answer helped you find a solution.

How do you build a webapp?

Probably a very stupid and easy question.
I'm new to React but I'm honestly new to software engineering in general.
I'm trying to build a web app, but I have no idea how.
I don't know anything about web apps, except that you should know a bit of HTML, CSS, JS.
Anyway, I went into this link https://reactjs.org/docs/create-a-new-react-app.html to create my first React app. I followed the instructions carefully and I now have this tab opened on pc:
I of course would like to edit the code and start making my app. But how? Where?
Where is this code written? Inside the directory that I used there is still nothing. I looked for "src" or "App.js" on my pc and found nothing. Where is it? Should I download anything else?
I'm a bit lost with this so any help would be appreciated.

Website is ready, how the hell do I make it responsive?

As mentioned on the title, Iv'e just finished making a static website, using - CSS/JQUERY/SLICK/JQUERY/BOOTSTRAP.
And I have no idea what to do or where to start in order to make it responsive, tried google but still feeling confused not sure about where to start...
As for now minimizing the page seems to do nothing but cutting the area been minimized.
Changing the view to phone-view on chrome devtool causing the website to look the same, just extremely small which means you can't really read text or anything without zooming in.
any ideas or guidelines of how to start?... feeling lost which is weird cuz am feeling pretty comfortable with the method mentioned above.
Thanks alot for reading!
Thinking the mobile site after doing the standard one is not a good idea. But you are already at the end of that road and there is no going back now.
Responsiveness mostly works on the CSS side. You cambine media queries to specify which CSS should be used for each screen size, but it also has to do with your content structure. As mentioned in the comments, using rows and columns when designing your site helps doing the mobile site a lot.
I suggest you start reading this if you haven't: http://www.w3schools.com/css/css_rwd_intro.asp
And go through each section under the Responsive Web Design section. It should give you a good introduction to help you get started.

Cakephp 2.X Website Looks Cached

I am trying to spin up a web application but Im having a really small problem and Im not sure how to handle it. I have did it before a long time ago but forgot (CLUTZ). When I try to access my application I see the login screen but it looks cached. I see a white page and I can see the links. The layout doesn't load for some reason. Like I said, this is a very small issue that I know someone can assist me with. If you give an answer please explain so that I can learn from it. Thanks a mil!
It sounds like what you're describing is CSS not loading. Doublecheck your <link href="…" rel="stylesheet"/> tags to ensure that they're pointing to the correct files.

Viewport on mobiles not defaulting to show full site

i have a fixed width site, and the client has requested that when it is viewed on a mobile, it should show the whole site by default (ie zoomed out).
In my head i have the following:
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
Which is the code that came with the wordpress template im currently using.
Ive looked around various answers on here, and tried various different combinations, however, whichever i use, the site always loads on a mobile with the screen zoomed right in to the top corner (have tested a couple on phones, and a couple with responsinator).
I know im probably being really daft here and missing something really obvious, but if anyone could help itd be hugely appreciated!
If anyone would like to take a look at the site directly, its EdoMidas.com
try this:
Replace 1140 with the width of your website.

Resources