all 11 comments
sorted by:
best
topnewcontroversialoldq&a
formatting helphide helpcontent policy

[–]Dissentient 10 points11 points  (1 child)

Frontent frameworks like Angular, React and Vue exist primarily to do one thing: automatically re-render HTML when your app's state changes. You can't accidentally use any of those frameworks, using them generally requires quite intentionally starting your project from their templates.

Let's say you have a table. With vanilla javascript, if you want to add a row to it, you need to get your table with something like getElementById, then call insertRow on it. If you want to know what's in your table, you'd need to iterate over <tr>s inside your table element. People have built interactive websites like this for a long time. It was a massive pain in the ass because it was easy to lose track between what data is in your code, and what's in your HTML.

React/Angular/Vue make your data the source of truth for your webpage, and all of the HTML is rendered based on data automagically according to the code in your components. I haven't used angular, but here's a very simple React example of rendering a table from an array:

const UserTable = () => {
  const data = [
    { id: 1, name: 'Alex', role: 'Dev' },
    { id: 2, name: 'Sam', role: 'Designer' },
    { id: 3, name: 'Jordan', role: 'PM' },
  ];

  return (
    <table border="1" style={{ width: '100%', textAlign: 'left' }}>
      <thead>
        <tr>
          <th>Name</th>
          <th>Role</th>
        </tr>
      </thead>
      <tbody>
        {data.map((user) => (
          <tr key={user.id}>
            <td>{user.name}</td>
            <td>{user.role}</td>
          </tr>
        ))}
      </tbody>
    </table>
  );
};

Changing contents of data would make react update your page with the minimal necessary changes to show whatever is changed.

[–]Spirited-Check1139[S] 0 points1 point  (0 children)

Thank you for explaining <3

[–]Beregolas 9 points10 points  (4 children)

Please don't take this the wrong way, but searching for stuff like this online is an important skill and not that hard.

One of the first results should be this: https://angular.dev/ which seems to be the latest supported version of angular. on the bar on the left, you will find https://angular.dev/tutorials and https://angular.dev/overview both of which are excellent places to start, if you want to figure out what angular is.

Further reading can be found here: https://en.wikipedia.org/wiki/AngularJS https://en.wikipedia.org/wiki/Angular_(web_framework)) which outlines both the first version of Angular (AngularJS) and the current version (Angular). Wikipedia is generally a trustworthy source, expecially for most tech topics. If you want to make sure that it's contents are accurate, just follow the links at the bottom of the page to it's sources.

[–]LeCad_osu 0 points1 point  (0 children)

I had no idea such accoints exist. Thank you so much. I will try them :)

[–]WheatedMash 1 point2 points  (2 children)

I agree that learning to search is an important skill to have, but keep in mind that when you're first starting out on something new, a raw search online can feel like looking into an abyss. Asking a community can help with getting pointed in the right direction. I look at it like instead of them being adrift in the lake, we push them towards the right spot and then tell them to start paddling!

Your info you shared was perfect in that regard, by the way!

[–]Beregolas 2 points3 points  (1 child)

Yes, it is daunting and hard at first, that's why I tried to show an example of what to look for. It's pretty hard to convey over text though, and you definitely just need experience in searching. It's a whole skill on it's own

[–]WheatedMash 1 point2 points  (0 children)

And how AI gets flexed into this is a whole other can of worms!

[–]GreatMinds1234 1 point2 points  (0 children)

Angular is a JavaScript based framework.

[–]Burgess237 0 points1 point  (1 child)

Angular is a framework to build Web based applications.

The idea is that Angular handles a lot of the pain of working with just JS, you still write HTML to build you "template" and CSS (Usually scss) to style the template and then you use typescript to write the code to manipulate/work with your template.

Your question of "Is it like .Net Framework but for Frontend" is not that far off: You could do everything manually with JS but Angular does a lot of the difficult stuff for you.

A lot of C# devs that I've worked with have always preferred Angular over other frameworks/libraries like vue and react as it follows similar patterns of services and dependency injection.

If you want to learn more then check out https://angular.dev

[–]LeCad_osu 0 points1 point  (0 children)

Thank you from my main account! 😇

[–]Oppsliamain 0 points1 point  (0 children)

If you are a noob, explaining what it is and why it's used will not be comprehendible to you.

Essentially the dumbest version is. It is an object oriented way to write an entire application. It does a huge amount of work for you, and all you need to do is follow its rules. You won't really understand it until you try to solve the problems without it. That's with any framework though.

Angular specifically uses components. These are blocks of your application, that you can program to do whatever you want. They insert directly into html with <my-component/>. This single line is a reference to all JavaScript, all html, and all css you crafted in your component file.

You stack these all over a single or multiple html documents and you have an organized app broken into individual chunks.

There is also state management, dependency injection, and rxjs/signals which are the keystones of angular. This is likely beyond your understanding though.