Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/johnnygerard/fem-todo-app

Todo app
https://github.com/johnnygerard/fem-todo-app

angular frontend-mentor sass

Last synced: about 1 month ago
JSON representation

Todo app

Host: GitHub
URL: https://github.com/johnnygerard/fem-todo-app
Owner: johnnygerard
License: mit
Created: 2024-02-29T18:37:31.000Z (11 months ago)
Default Branch: main
Last Pushed: 2024-03-06T14:25:20.000Z (11 months ago)
Last Synced: 2024-04-15T10:28:28.175Z (9 months ago)
Topics: angular, frontend-mentor, sass
Language: TypeScript
Homepage: https://fem-todo-app-jgerard.vercel.app
Size: 356 KB
Stars: 0
Watchers: 1
Forks: 0
Open Issues: 0
Metadata Files:
- Readme: README.md
- License: LICENSE.txt

Awesome Lists containing this project

README

        # Frontend Mentor | Todo app

This is my solution to the [Todo app challenge](https://www.frontendmentor.io/challenges/todo-app-Su1_KokOW) from [Frontend Mentor](https://www.frontendmentor.io/).

[![project status](https://img.shields.io/badge/status-solution%20published-success?style=for-the-badge)](https://www.frontendmentor.io/solutions/todo-app-with-drag-and-drop-uivwkxqkHD)

 ## Tech Stack

- Angular 17

- Sass

## Main Features

- Angular signals

- [Angular Material CDK Drag and Drop](https://material.angular.io/cdk/drag-drop/overview)

- [ImageKit](https://imagekit.io/) CDN

- [NgOptimizedImage](https://angular.io/guide/image-directive) with placeholder

- Standalone components

- Bash automation (see [PR #1](../../pull/1))

- [GitHub Actions](../../tree/main/.github/workflows):

  - Vercel deployments

  - CodeQL analysis

## Developer Tools

- VS Code

- Figma

- GitHub Copilot

## Links

- [Website](https://fem-todo-app-jgerard.vercel.app) hosted with [Vercel](https://vercel.com/)

- [Solution](https://www.frontendmentor.io/solutions/todo-app-with-drag-and-drop-uivwkxqkHD)

## Screenshots

### Mobile Light Theme

![mobile light theme screenshot](screenshots/mobile-light-theme.avif)

### Mobile Dark Theme

![mobile dark theme screenshot](screenshots/mobile-dark-theme.avif)

### Desktop Light Theme

![desktop light theme screenshot](screenshots/desktop-light-theme.avif)

### Desktop Dark Theme

![desktop dark theme screenshot](screenshots/desktop-dark-theme.avif)

## About Frontend Mentor

[Frontend Mentor](https://www.frontendmentor.io/) challenges help you improve your coding skills by building realistic projects.

## Copyright

© 2024 Johnny Gérard