https://github.com/hamzahamidi/angular-forum

Forum application built with Angular
https://github.com/hamzahamidi/angular-forum

angular angular14 authentication crud demo docker docker-compose gh-pages github-actions hacktober hacktoberfest javascript jwt jwt-authentication typescript

Last synced: 3 months ago
JSON representation

Forum application built with Angular

• Host: GitHub
• URL: https://github.com/hamzahamidi/angular-forum
• Owner: hamzahamidi
• License: mit
• Created: 2018-05-07T11:04:00.000Z (over 6 years ago)
• Default Branch: main
• Last Pushed: 2023-02-04T00:49:23.000Z (almost 2 years ago)
• Last Synced: 2024-10-12T06:48:23.759Z (3 months ago)
• Topics: angular, angular14, authentication, crud, demo, docker, docker-compose, gh-pages, github-actions, hacktober, hacktoberfest, javascript, jwt, jwt-authentication, typescript
• Language: TypeScript
• Homepage: https://hamidihamza.com/angular-forum
• Size: 6.8 MB
• Stars: 74
• Watchers: 9
• Forks: 46
• Open Issues: 8
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        


    

        

    

    

        

    

    

        

    

    

        

    



> ### Angular project containing real world examples (CRUD, auth, advanced patterns, etc).

# ![Angular Forum App](logo.png)

### [Demo](http://hamidihamza.com/angular-forum)    

This codebase was created to demonstrate a fully fledged application built with Angular that interacts with an actual backend server including CRUD operations, authentication, routing, pagination, and more.

# Getting started

Make sure you have the [Angular CLI](https://github.com/angular/angular-cli#installation) installed globally. 

We use npm the default package manager of NodeJs & install the dependencies with `npm install`.

Run `ng serve` for a dev server. Navigate to `http://localhost:4200/`. The app will automatically reload if you change any of the source files.

## Building the project

Run `npm run build` to build the project. The build artifacts will be stored in the `dist/` directory.

## Docker

Or simply run the example using docker:

```bash

docker-compose up

```

Then navigate to `http://localhost:4200/

## Functionality overview

The example application is a social blogging site (i.e. a Medium.com clone). You can view a live demo over at http://hamidihamza.com/angular-forum/

**General functionality:**

- Authenticate users via JWT (login/signup pages + logout button on settings page)

- CRU* users (sign up & settings page - no deleting required)

- CRUD Articles

- CR*D Comments on articles (no updating required)

- GET and display paginated lists of articles

- Favorite articles

- Follow other users

**The general page breakdown looks like this:**

- Home page (URL: /#/ )

    - List of tags

    - List of articles pulled from either Feed, Global, or by Tag

    - Pagination for list of articles

- Sign in/Sign up pages (URL: /#/login, /#/register )

    - Uses JWT (store the token in localStorage)

    - Authentication can be easily switched to session/cookie based

- Settings page (URL: /#/settings )

- Editor page to create/edit articles (URL: /#/editor, /#/editor/article-slug-here )

- Article page (URL: /#/article/article-slug-here )

    - Delete article button (only shown to article's author)

    - Render markdown from server client side

    - Comments section at bottom of page

    - Delete comment button (only shown to comment's author)

- Profile page (URL: /#/profile/:username, /#/profile/:username/favorites )

    - Show basic user info

    - List of articles populated from author's created articles or author's favorited articles