njong392 / abbreve Goto Github PK
View Code? Open in Web Editor NEWA simple website, that fills out abbreviations for popular slangs.
Home Page: https://abbreve.vercel.app/
License: Apache License 2.0
A simple website, that fills out abbreviations for popular slangs.
Home Page: https://abbreve.vercel.app/
License: Apache License 2.0
Hi! I have some small color changes that can make the application more accessible.
I changed the original purple color to deep purple and added a slightly lighter purple to make some parts of the text more readable. I also made the gray a bit lighter.
Let me know if you like it!
No response
While I was giving a try to Abbreve, i typed ngl but unfortunately didn't get any results in return - i know the project is still so young but no problem.
Same thing goes for ftw.
To help new contributors know exactly what to do and what to expect of the project...
No response
No response
The current structure of db looks like:
[abbreviation]: {
definition: string,
alternatives?: string
}
which is good, but we can improve on the structure by making the alternatives
prop required and an array. So the new structure now becomes:
[abbreviation]: {
definition: string,
alternatives: string[]
}
Using the proposed structure gives us the possibility to add other features, such as linking related abbreviations and other benefits as the app grows
Below is an example showing the current structure and how it would look like after implementing the proposed structure
BEFORE:
{
"lgtm":{
"definition":"Looks Good To Me",
"alternatives": "Looks Great To Me, Looks Great To Merge"
},
"lfg":{
"definition":"Let's Fucking Go",
"alternatives" : "Life Feels Good, Looking For Group"
},
"idk":{
"definition": "I Don't Know"
},
"imo":{
"definition": "In My Opinion"
}
}
AFTER:
{
"lgtm":{
"definition":"Looks Good To Me",
"alternatives": ["Looks Great To Me", "Looks Great To Merge"]
},
"lfg":{
"definition":"Let's Fucking Go",
"alternatives" : ["Life Feels Good", "Looking For Group"]
},
"idk":{
"definition": "I Don't Know",
"alternatives": []
},
"imo":{
"definition": "In My Opinion",
"alternatives": []
}
}
No response
We can even further improve on the structure to include more information like so:
[definition]: {
definition: string,
contexts: string[], // Check explanation at the bottom
alternatives: {
definition: string,
contexts: string[] // Check explanation at the bottom
}[]
}
Example:
{
"lgtm": {
"definition": "Looks Good To Me",
"contexts": [
"chat",
"conversation"
],
"alternatives": [
{
"definition": "Looks Great To Me",
"contexts": []
},
{
"definition": "Looks Great To Merge",
"contexts": [
"collaboration",
"teamwork"
]
}
]
},
"lfg": {
"definition": "Let's Fucking Go",
"contexts": [],
"alternatives": [
{
"definition": "Life Feels Good",
"contexts": []
},
{
"definition": "Looking For Group",
"contexts": []
}
]
},
"idk": {
"definition": "I Don't Know",
"contexts": [],
"alternatives": []
},
"imo": {
"definition": "In My Opinion",
"contexts": [],
"alternatives": []
}
}
Explanation:
The contexts
field is an array of contexts in which the abbreviation is mostly used.
Notes:
Automatically, all alternatives under each abbreviation fall under the contexts provided for the main definition
e.g
Both Looks Great To Me
and Looks Great To Merge
fall under chat
and conversation
contexts since they are both alternatives to the Looks Good To Me
definition
DISCLAIMER!
The items I used for each context are just for demonstration purposes.
What issue are you facing? Missing Abbreviation
Which slang/feature/bug? :lmk
Bug description: No bug
Upon submitting, show some error if there's no information.
No response
No response
Missing AbbreviationlmkNot a bug
Hi everyone,
There's not enough contrast between background color and text color when the user hovers over the Get Started link (navbar).
I don't know if the text could be changed to a lighter color or just not have a change of color on hover since there's already a scale effect.
Picture of the button on hover:
No response
What issue are you facing? Missing Abbreviation
Which slang/feature/bug? :FGS - for god's sake (or rated R version: FFS - for fuck's sake)
Bug description:
Removing text after submitting form would be a nice option.
No response
No response
CONFLICTING ABBREVIATIONS
I think room should be made for some abbr. terms like "WTH" which has more than one meaning i.e " What the heck" and "What the hell".
@Njong392
Consider adding the hacktoberfest topic to this repo to bring more potential contributors to this project .
What do you think?
No response
I'm thinking since this is more like a dictionary-like app, the page length should be that long. A smaller font size for the main text and some other little rearrangements and optimization should be help to fix this to a level.
No response
No response
Maybe the white text color should be retained since it scales already (indicating it's state) or what do you think
No response
No response
Bugsample text question answersample text question answer
I think "use cases" could be added to the terms to give users more insight into the term to those who are new to it and as an illustration.
No response
This issue is to add a new slang ootd
, ttyl
, rofl
and tc
to the app.
OOTD stands for Outfit Of The Day.
TTYL stands for Talk To You Later.
ROFL stands for Rolling On the Floor, Laughing
TC stands for Take Care
@Njong392 I am open to making this PR.
No response
What issue are you facing? Missing Abbreviation
Which slang/feature/bug? :til = today I learned
Bug description:
Currently, users have to scroll down in order to search for abbreviations, which IMO is not a good UX since the main focus of the app is for users to quickly find definitions for abbrevs.
My proposal is to move the search input to the top so that users can easily and quickly search for abbrev definitions.
As you can see, the search input + button is visible the moment the user opens the app without even scrolling down
No response
We need to update the repo README.md to account for the changes made in #64.
No response
Currently, there's no indication to show when the app is looking up the definition for my searched abbrev.
It would be an improvement in UX to show a loading animation when a search is running
No response
No response
When we put wrong slang or slang that is not present or the search bar is empty, we get a msg telling us the real problem like
this
1. When slag is not present
- This entry does not exist in our records as of yet :(
1. You can help us add this by creating a [github issue](https://github.com/Njong392/Abbreve)
2. Or, you could fill out this [feedback form](https://t.co/mp86BLYBhq) and we will address the issue
2. When SearchBar is Empty
- Search bar π is Empty!. Please put abbreviation in search bar
But when either of these messages appears, the content on its left gets displaced slightly to the left. it will more clear from the SS I have added below.
No response
When a slang that does not exist is shown, there is a message to tell user that the slang does not exist. But if the next slang to be entered does exist, the abbreviation is shown. But the error message from the previous entry does not go away.
No response
The Logo used in the Navbar can also be up there as the favicon
No response
No response
Currently, we have prettier but you'd have to manually run npm run format
to format the code base before pushing changes.
Sometimes, one might forget to format the code base before pushing changes.
Adding husky prevents this by automatically formatting the code base before each commit
No response
No response
What issue are you facing? Missing Abbreviation
Which slang/feature/bug? :tbh = to be honest
Bug description:
We need some rules to make sure that contributors adhere to and collaborate in ways that are suitable for everyone else.
No response
No response
It would be great to show search suggestions for similar abbrevs when the user starts typing in the search box.
No response
Sometimes, you may forget an abbrev but you know the first few characters. Adding search suggestions provides a good ux in such situations
The screenshot in the README was recently substituted by a GIF. But the markdown link of the added GIF is showing in the README, and this doesn't look very good. You can see the link above the gif itself.
Open the README file in edit mode (You have to fork the repo to do this) and in the section where the gif is added, and change
![Gif of form section of page with 'various types into the search bar, it's meaning below it, and alternative meanings](![abbr](https://user-images.githubusercontent.com/12339188/194400070-58974868-221c-40fe-9f73-c19d22f764db.gif)
to
![Gif of form section of page with 'various types into the search bar, it's meaning below it, and alternative meanings](https://user-images.githubusercontent.com/12339188/194400070-58974868-221c-40fe-9f73-c19d22f764db.gif)
No response
Since this is open to the public now, adding a license like Apache 2.0 would probably be cool.
No response
No response
I think it's much better if the search bar is located at the top, it's easier to find.
Just a thought
What issue are you facing? Missing Abbreviation
Which slang/feature/bug? :ikr = I know right
Bug description:
What issue are you facing? Missing Abbreviation
Which slang/feature/bug? :hello this is a test
Bug description:
I noticed that the last time a release for this project was done
How about create an automatic release, that happens whenever some contributes to this project, it will use the conventional commit.
Here's a link for reference:
Set Automatic Release (Skip Commitizen)
Conventional Commit
This can only be done by the owner of the repo
What issue are you facing? Missing Abbreviation
Which slang/feature/bug? :TBF = to be fair
Bug description:
Consider appending the abbreviations on the homepage to the JSON database
No response
No response
Let's talk through a few different scenerios:
When user types in value for an existing abbreviation and then clicks the search button, the definition appears as expected.
If user types in the following AFTER db.json has already been fetched once:
a. An existing abbreviation, it appears as expected without having to press the submit button.
b. However when a user types in an abbreviation that doesn't exist in db.json, nothing appears, no error message, etc.
How do we want to handle the scenerios for 2a & 2b? Here are possible solutions:
I propose the 2nd condition as a fix to the problem. Thoughts?
No response
No response
Users should be notified if a record they have entered isn't available in the JSON database yet. This is yet to be worked upon.
No response
No response
Bugsample text question answersample text question answer
Instead of a picture of the website for demo in the readme, would be nice to have a gif instead
No response
No response
TBH - To Be Honest
ROFL - Rolling Around Floor Laughing
FFS - For F*ck Sake
No response
Currently, there's only one db.json file, which contains all definitions and as the DB file grows (more definitions added) there'd be at least the following issues:
...plus many other possible issues
My proposal is, to split each abbreviation into its own file like below:
Abbreve
βpublic
ββserver
βββdb
β β gtm.json
β β lfg.json
β β idk.json
β β ...
Where each JSON file contains the definition of an abbreviation. The actual abbreviation would be the name of the JSON file.
Note: The structure of each abbreviation would still be the same, (I made a proposal for improving the structure in #42)
No response
By using my proposed solution,
Caveats
Using my proposed solution means changing the structure of all abbreviations becomes difficult, but we can solve this by creating a simple app for changing the structure of all abbreviations.
db.json file contains repeattive data, see from line 172 to line 332 (as of now).
No response
when the search input is empty, hitting the submit button sends a request and all the abbreviations are fetched successfully but unable to find a matching abbreviation for the empty string '', hence resulting in the error message.
Adding input validation should fix this. Thank you, this is my first time creating an issue.
No response
No response
A declarative, efficient, and flexible JavaScript library for building user interfaces.
π Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. πππ
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google β€οΈ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.