/r/beginnerwebdev

Photograph via snooOG

A place for beginners to learn about web development and programming including HTML, CSS, JavaScript, Back-end, Front-end, Web Hosting, Web Design, WordPress, etc...


Rules

1) Do not post memes, screenshots of bad design, or jokes.

2) Read and follow reddiquette; no excessive self-promotion

3) No commercial promotion or solicitation


Recommended Subreddits:

r/webmasters
r/webdev
r/web_design
r/webhosting
r/1000daysofpractice

/r/beginnerwebdev

1,260 Subscribers

1

Base 2, 8 and 16 numeral systems tutorial for beginners

0 Comments
2024/10/05
16:52 UTC

2

i’m learning css

omg i’m learning css now and its so hard for me to understand! i’m taking a course on udemy, if anyone has any tips that could help me please let me know :-)

1 Comment
2024/10/02
14:50 UTC

1

Divs vs img by itself

Just wondering if there are advantages to having an img inside of a div rather than just inserted into the HTML by itself. I’ve been playing with resizing things using the div vs just applying the sizing directly to the img and I’ve found I can basically achieve the same thing if I play around with the CSS. So what the advantages are there?

1 Comment
2024/08/31
04:45 UTC

3

Differences between full stack js and React?

I'm learning, spending a lot of time to become a web dev, and I'm seeing a lot of similarities with FS JS and React. I know that React is just a library. Is there anypoint in knowing full-stack when I can just use react?

3 Comments
2024/08/22
19:21 UTC

2

Looking for free/cheap hosting for Intertia+React+Laravel project

As a thesis project for school, I have recently made a webapp using Laravel, React and Inertia. As I will soon need to start paying a hefty sum to my current webhost Combell, I need to find an alternative. My goal is to show the webapp to potential employers. So I don't need a fancy domain name.

I have spent hours looking at alternatives, but as I have been taught only one way to upload and deploy the project, I must say I feel like I'm in over my head.

To give you an idea of what I'm familiar with: in a nutshell,

  1. I have used SSH to clone my Github repo to my webhost,
  2. used SSH to set op the Laravel side of the project, (composer install, setting up the .env, generating an app key and migrate)
  3. used SSH to compile the React side, (npm install, npm run build)
  4. using the webhost's gui, I have linked the project's subsite's URL to the 'public' subfolder of my project.

Turns out it's not easy to find free webhosting that fits the bill. The bill being:

  • PHP and SQL server. (Currently using sqlite)
  • SSH access to run the Laravel and React related commands I mentioned.
  • Ideally subwebsites/subdomains (as I want to host several projects; this is just the most complex one)
  • Ideally Github integration = using a GUI or SSH to clone/pull. Manually uploading the project files (using FTP for example) would also do.
  • Ideally free, but because I am starting to think that doesn't exist considering the other requirements: around 5 €/$ per month at the most.

I have been tinkering with Vercel, but deploying my repo fails. I'm not even sure Vercel supports PHP (out of the box). Netlify seems equally complicated/unfamiliar. Guides for this particular scenario seem to be spread thin. So I'm starting to think I might just need a more "classic" webhost. I'm hoping someone can recommend one, or a way to get my project on Vercel or a similar service.

1 Comment
2024/08/22
15:49 UTC

1

Question About Updating jQuery on a Locally Hosted Web Server Website (IIS)

0 Comments
2024/05/01
17:04 UTC

1

How to add a "see more" link on my website (for a non-coder)?

Hello, I need to add a "see more" link for some lengthy text on my website. I'm using hostinger website builder, and I'm not a coder and a non-tech person :)

Anyway I can do this without having to learn code? Thank you!

0 Comments
2024/04/16
14:17 UTC

1

Issue with Rendering

Hello there, so I’m pretty new to coding and I’m working on a project that I’ve hit a wall with. I’m trying to render a card image gallery using a logged in user’s data. But try as I might the code isn’t working.

My database has a users array, decks array, and cards array. I’m trying to get the code to render the images of the cards in a user’s deck. I can see in the developer tools that it’s pulling the user’s data and deck but when it goes to pull the cards it pulls a copy of the whole cards array for each card in the deck rather than pulling the info for the specific card.

Could anyone give me some insight on how I would go about doing this effectively? (Example of what database kind of looks like below)

“Users”:[{ “Id”: 1, “Fullname”: Matt Gray, “Email”: matt@gmail.com, “DeckId”: 1 }], “Decks”: [{ “Id”: 1, “Name”: “First Deck”, “CardId”: [1, 2, 3, 4, 5] }], “Cards”: [{ “Id”: 1 “Name”: “A”, “RegionId”: 1, “TypeId”: 1, “ImageURL”: “imageurl.jpeg” }], “Region”:[{ “Id”: 1, “Name”: “Naroom” }], “Type”:[{ “Id”: 1, “Name”: Creature }]

0 Comments
2024/03/29
04:05 UTC

2

Could Themex be helpful to you?

I'm new here and looking for feedback for my application that I wrote with React.

https://app.themexproject.com

0 Comments
2024/03/02
20:12 UTC

2

Advice please!

I'm currently in my first semester of an associate program for web development and planning on double majoring in software development as I would only need 4 more classes once I finish web development program. I started the odin project for more practice and plan on doing some bootcamps to learn more.

My question is what languages and/or frameworks should I learn/focus on when searching for a job afterwards? What has benefited you more in the workplace??

Thanks in advance!

1 Comment
2024/02/28
20:32 UTC

1

What’s your favorite tech stack for the least amount of coding and maximum amount of productivity?

0 Comments
2023/10/24
11:46 UTC

1

What are the skills that make the difference between a junior, a mid-level or a senior react developer?

0 Comments
2023/10/13
11:23 UTC

1

What would you consider the best language to learn for a beginner that also teaches good programming practices?

0 Comments
2023/10/05
17:15 UTC

1

How important is using the right tags, such as <section>, <h1>, h2> etc?

2 Comments
2023/10/04
14:05 UTC

1

Which you find more challenging? Frontend or Backend

0 Comments
2023/10/02
18:54 UTC

0

A Portfolio Website with next.js, three.js, and GSAP

0 Comments
2023/02/19
07:36 UTC

2

Looking for guidance in developing a user-generated focused website - WordPress

Hi Reddit,

I have a general idea of what I’d like to create, but having trouble with the specifics of WordPress development. I admit I’m new to WordPress (willing to learn), so forgive me if I ask fundamental questions. A bit of experienced guidance would suffice!

The goal of the website is to collect user-generated content (paragraph or two of testimonials/experience) and have the content displayed anonymously on a scrollable homepage.

A few minimal parameters are to have a user not be affiliated with the webpage (or need to sign in or use a username)—as posts must be approved by an admin of the webpage (preferably something user-friendly on the backend). The fields I’m looking for are 1) the Post title, 2) the Post body, & 3) submit button. Forward-thinking—Ideally, in the future, I would like to add the ability to have a second button that adds the ability to contribute content with the additional sense of donating $1 via PayPal (another optional button).

I would then like this approved content displayed on a scrolling timeline. It must be something that flows from one post to another and not be separated by reading submitted content on another separate page (I hope that is clear).

In general, that’s the sense of the webpage, along with some additional tabs that explain the project and whatnot. Anyway, any leads, articles, plugins, guidance—anything to point me on the right path would be greatly appreciated.

(Experience: I have had a brief experience with basic HTML in high school and developed a few websites with Dreamweaver in the past as well as Wix).

I would appreciate anyone's time and talent.

All the best!

0 Comments
2023/02/08
21:36 UTC

1

Drupal 10 | Enable Theme Suggestions

0 Comments
2023/02/03
12:16 UTC

2

Easy Drupal 10 multi-site setup with DDEV

0 Comments
2023/01/21
03:10 UTC

1

Re-recorded: Install Drupal 10 in 5 minutes (thanks for feedback on original)

0 Comments
2023/01/21
02:18 UTC

2

Install DDEV, the local PHP development environment

0 Comments
2023/01/16
12:40 UTC

1

Picking Colors on the Web: Several tools to help you find complementary colors and color palettes

0 Comments
2022/11/24
20:05 UTC

3

Have a Static Website just ping another CMS

I'm a rookie, sorry if it is too basic, but i just don't know how to phrase for research:

I noticed a lot of the projects I want to do, do not need a CMS at all. So SSG became very appealing to me.

My websites they're nothing fancy, they don't need any maintenance besides post one or more content every 3~4 months, and they're very, very small. No accounts, no cookies, no data collecting, except one.

The one thing that would be helpful for me, and that is just knowing where most people are accessing from.

I'm not even talking about cities and states, just the country is good enough.

Would the host itself be able to provide me that data or is there a way to use javascript to just tell another wesbite with CMS that "hey someone from Ireland accessed my page, no need to ping me back, see ya"

1 Comment
2022/09/30
20:09 UTC

3

Why does this code cause the browser to crash?

SOLVED


I'm following Web Dev Simplified's react crash course.

In it there is this piece of code which receives a function as a prop and that gets used in the onChange event. Works fine.

However it is done in a rather convoluted round about way via another function:

const Todo = ({ todo, toggleTodo }) => {

  function handleTodoClick() {
    toggleTodo(todo.id)
  }

  return (
    <div>
      <label>
        <input type="checkbox" checked={todo.complete} onChange={handleTodoClick} />
        {todo.name}
      </label>
    </div>
  )
}

If I remove the extra function and call the prop passed function directly like so

onChange={toggleTodo(todo.id)}

then to browser goes unresponsive & FF complains about page slowing down. In my mind they're the same thing?

Clearly this extra step is meant to work around some limitation/idiosyncrasy, but its not explained in the vid & I can't figure out what it is. Could someone explain please?

3 Comments
2022/09/24
09:13 UTC

1

Great Starting Course for any Beginner Wordpress Developer!

0 Comments
2022/09/23
20:03 UTC

Back To Top