GithubHelp home page GithubHelp logo

techshowcase / builtwithanalog Goto Github PK

View Code? Open in Web Editor NEW
7.0 1.0 2.0 14.76 MB

Showcase and market your AnalogJS apps | Open Source Project

Home Page: https://builtwithanalog.dev

License: MIT License

HTML 2.48% TypeScript 88.58% SCSS 8.94%
analog analogjs built open-source showcase with built-with-analog market angular

builtwithanalog's Introduction

Built With Analog

This repository holds the code for builtwithanalog.dev, a platform dedicated to featuring projects built with AnalogJS.

About

Built With Analog is a platform where developers can showcase their Analog projects. It is designed to promote all kinds of projects, providing a unique opportunity for developers to gain visibility and even earn money by featuring their paid projects.

Key Features

  • Showcase Your Work: Developers can submit their Analog projects to be featured on the platform, allowing them to share their work with a broader audience.
  • Promote Open Source: Open source projects can gain more traction and contributors by being featured.
  • Earn Money: In addition to free projects, paid projects can also be featured, providing developers with a potential revenue stream.
  • Contribute to Open Source: A unique aspect of BuiltWithAnalog is that it allows developers to contribute to open source by featuring their own projects!
  • Search and Filtering: Users can easily search and filter projects based on various criteria, making it simple to find relevant projects of interest.

Contributing

We welcome contributions to BuiltWithAnalog! If you would like to feature your project or contribute to the platform, please refer to our CONTRIBUTING.md for detailed guidelines on how to get started.


Thank you for your interest in BuiltWithAnalog. We look forward to seeing your amazing projects and contributions!

Analog App

This project was generated with Analog, the fullstack meta-framework for Angular.

Setup

Run npm install to install the application dependencies.

Development

Run npm start for a dev server. Navigate to http://localhost:5173/. The application automatically reloads if you change any of the source files.

Build

Run npm run build to build the client/server project. The client build artifacts are located in the dist/analog/public directory. The server for the API build artifacts are located in the dist/analog/server directory.

Test

Run npm run test to run unit tests with Vitest.

Community

builtwithanalog's People

Contributors

dependabot[bot] avatar geromegrignon avatar monacodelisa avatar pbouillon avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar

builtwithanalog's Issues

Feature: Update default og:image

Type of feature

✨ Feature

Current behavior

has the old design & image path

Suggested solution

add the new screenshot of the updated website

Additional context

No response

I would be willing to submit a PR to fix this issue

Project Name: NG Rome

Cover Image

  • file in PR

Project URL

https://ngrome.io/

Project Category

Community

Angular Version

18.0.0

Analog Version

unknown

UI Library

possibly Tailwind CSS

Pricing

free

3D

false

Developer

NG Rome

I am aware that if the project is not free to use, there will be a fee to feature it on BuiltWithAnalog

  • Yes I am aware
  • No

I would be willing to submit a PR to add the project to BuiltWithAnalog, if approved

Feature: add Tailwind CSS to UI lib options

Type of feature

✨ Feature

Current behavior

Tailwind CSS is not listed

Suggested solution

  • add Tailwind CSS in JSON info
  • add icon svg
  • display it in card and dropdown

Additional context

No response

I would be willing to submit a PR to fix this issue

Feature: Sync search and URL parameters

Type of feature

✨ Feature

Current behavior

When selecting filters, none are persisted in the URL. It makes it impossible to share/bookmark.

Suggested solution

It could be great to add filters on the URL upon selection and restore them on startup if any has been set:

query params suggestion

Additional context

No response

I would be willing to submit a PR to fix this issue

Feature: Add basic responsiveness

Type of feature

✨ Feature

Current behavior

  • responsiveness been partially addressed

Suggested solution

minor adjustments:

  • header
  • footer
  • pages

also can be don in the same PR:

  • use a different selector not chevrondownicon

even though this is actual existing element
image

it is not a standard one and GitRoll sees it as a bug

image

would be easier hopefully to just use the class or something

Additional context

No response

I would be willing to submit a PR to fix this issue

Bug: Images served from the API endpoint do not load from `assets/images/projects`

Describe the bug

I tried loading and hosting the images normally from the assets/images/projects folder within this repo, but that doesn't seem to work

  • this is possibly related to the build error on Windows which hasn't been something that I can bypass
  • the built is only happening during Netlify deployment
  • a temporary solution I decided to go for is to just host all images in the images repo in the projects folder, and I am serving them from there

What needs to be done

Prerequisite

Issue #32 to be completed first, it will help with this

Browsers

No response

Additional context (Is this in dev or production?)

might be Windows related

I would be willing to submit a PR to fix this issue

Feature: Retrieving the data using a service

Type of feature

✨ Feature

Current behavior

The HTTP call is made directly within the home component

Suggested solution

Extend the HTTP call to a service

Additional context

in consideration

I would be willing to submit a PR to fix this issue

Feature: update to Angular v18 and add PrimeNG

Type of feature

✨ Feature

Current behavior

  • angular v17 something
  • the project doesn't include any UI lib at the moment all custom SCSS

Suggested solution

I have worked with PrimeNG a lot but only on regular Angular projects

  • I have not even attempted to add PrimeNG to Analog projects
  • adding it will improve the UI - in my opinion
  • need to see if this can be setup without getting errors on Win machine
  • or let someone else contribute

Additional context

No response

I would be willing to submit a PR to fix this issue

Feature: Set up theming combining Analog's way with PrimeNG way

Type of feature

✨ Feature

Current behavior

  • Analog uses media query @media (prefers-color-scheme: light) I want to keep it
  • PrimeNG has specific setup of adjusting the angular.json, using a service and adding an element that loads stylesheets dynamically

Suggested solution

  • let's see if I can combine both

  • this one turns out to be a bit more challenging than I thought

  • cannot keep PrimeNG theming in the same file, that doesn't work as styles overwrite each other

  • I tried several implementations adding stuff to the vite.config.js

  • there has been a bit of a challenge in adding another link element directly in the index.html but I found a workaround for this

  • current biggest challenge is to separate the CSS files so that I get styles.css but also separate compiled dark.css and light.css which I can load dynamically

Additional context

  • suggestions are more than welcome

I would be willing to submit a PR to fix this issue

Feature: add PrimeNG Tooltip

Type of feature

✨ Feature

Current behavior

using title attribute

Suggested solution

replace the title attribute with primeng tooltip

Additional context

No response

I would be willing to submit a PR to fix this issue

Feature: Place the filter interface in a designated file

Type of feature

✨ Feature

Current behavior

the Filter interface is located in the filter component

Suggested solution

To maintain the regular organization and project structure it might be better to place the Filter interface in it's own file called filter.ts which is to be inside the models folder

Additional context

standard practice

I would be willing to submit a PR to fix this issue

Feature: Change endpoint URL based on environment

Type of feature

✨ Feature

Current behavior

  • right now all api calls are made to https://builtwithanalog.dev/api/projects which is the production endpoint
  • during development I am changing to http://localhost:5173/api/projects

Suggested solution

yes of course it will be more convenient to change the apiURL based on environment like I do for all other apps, has not been implemented over here yet

  • one option is to use vite
    const apiUrl = import.meta.env.VITE_API_URL;

with

# .env
VITE_API_URL=http://localhost:5173/api/projects

and

# .env.production
VITE_API_URL=https://builtwithanalog.dev/api/projects

but doesn't have to be this option, will consider and get to it at some point

Additional context

vite docs

I would be willing to submit a PR to fix this issue

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.