diff --git a/.github/PR_Template.md b/.github/PR_Template.md new file mode 100644 index 0000000..dd4f410 --- /dev/null +++ b/.github/PR_Template.md @@ -0,0 +1,23 @@ + + +## Related Issue* + +Closes #issue_number + + + +## Description + + + +## Screenshot Section (MUST) + + + + + +## Task + +- [ ] Follow us on GitHub +- [ ] Star the repo on GitHub diff --git a/.github/workflows/greet-issues.yml b/.github/workflows/greet-issues.yml new file mode 100644 index 0000000..ddce1a8 --- /dev/null +++ b/.github/workflows/greet-issues.yml @@ -0,0 +1,47 @@ +name: Greet Issues + +on: + issues: + types: [opened] + +jobs: + greet: + runs-on: ubuntu-latest + steps: + - name: Check out code + uses: actions/checkout@v3 # This should automatically be on Node 20 + + - name: Set up Node.js + uses: actions/setup-node@v3 # This should also be compatible with Node 20 + with: + node-version: '20' + + - name: Handle Issue Greetings + uses: actions/github-script@v6 # Update to a compatible version + with: + script: | + const issue = context.payload.issue; + if (!issue) { + console.error("No issue context available."); + return; + } + + const user = issue.user.login; + const message = `๐Ÿ‘‹ Hello @${user}! Thank you for opening this issue titled "**${issue.title}**"! We're excited to see your contribution and a maintainer will get back to you shortly ๐Ÿ˜Š! \n\nPlease ensure the following:\n1. Be respectful. \n2. Follow the contribution guidelines.\n\nHappy coding! ๐Ÿš€`; + + await github.rest.issues.createComment({ + ...context.repo, + issue_number: issue.number, + body: message + }); + + // Request more information if the issue body is empty + const issueBody = issue.body || ''; + if (issueBody.trim().length === 0) { + const requestInfoMessage = `๐Ÿง We would appreciate it if you could provide us with more info about this issue, @${user}! ๐Ÿค”`; + await github.rest.issues.createComment({ + ...context.repo, + issue_number: issue.number, + body: requestInfoMessage + }); + } diff --git a/.github/workflows/greet-pr.yml b/.github/workflows/greet-pr.yml new file mode 100644 index 0000000..704db0e --- /dev/null +++ b/.github/workflows/greet-pr.yml @@ -0,0 +1,16 @@ +name: Greetings + +on: [pull_request_target, issues] + +jobs: + greeting: + runs-on: ubuntu-latest + permissions: + issues: write + pull-requests: write + steps: + - uses: actions/first-interaction@v1 + with: + repo-token: ${{ secrets.GITHUB_TOKEN }} + issue-message: "Hi there! Thanks for opening this issue. We appreciate your contribution to this open-source project. We aim to respond or assign your issue as soon as possible." + pr-message: "Welcome to Our repository.๐ŸŽŠ Thank you so much for taking the time to point this out." diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md new file mode 100644 index 0000000..ef76949 --- /dev/null +++ b/CONTRIBUTING.md @@ -0,0 +1,63 @@ +

Contributors Guide for blockchainโšก

+

Welcome to blockchain! Make sure to star this repository๐Ÿ˜
We appreciate your interest in contributing.๐Ÿ˜Š
This guide will help you get started with the project and make your first contribution.

+ +--- + + +## Creating Your First Pull Request ๐ŸŒŸ +## 1. Star this repository: Show some love by starring the repository! +## 2. Fork this repository: Click the 'Fork' button at the top right of this page to create a copy of this repository in your account. +## 3. Clone the forked repository: + +```bash +git clone https://github.com//blockchain.git +``` + +## 4. Navigate to the project directory + +```bash +cd blockchain +``` + +## 6. Create a new branch (use descriptive branch names + feature/ or fix/): +```bash +git checkout -b feature/ +``` + +## 7. Stage your changes and commit (use descriptive commit messages like + feat: added new feature or fix: corrected issue): +```bash +git add . +git commit -m "feat: added new feature" +``` + +## 8. Push your local commits to the remote repository: +```bash +## git push -u origin feature/ +``` + +## 9. Create a Pull Request (PR): + Provide a detailed description of the changes you've made. + If it's a UI change, consider adding screenshots for better understanding. +## 10. Congratulations! ๐ŸŽ‰ You've made your contribution. + +## Pull Request Review Criteria ๐Ÿงฒ + +1. Please fill out the PR template properly when creating a pull request. +2. Assign yourself to the issue youโ€™re working on to help us track progress. +3. Never commit to the main branch. +4. Your work must be original and adhere to the project's coding standards. +5. Comment your code where necessary for clarity. +6. Always ensure all tests pass before pushing your changes. + + +## Communication and Support ๐Ÿ’ฌ +1. Join the project's communication channels to interact with other contributors and seek assistance. +2. If you have any questions or need help, don't hesitate to ask in the project's communication channels or comment on the relevant issue. + +## Code of Conduct ๐Ÿ˜‡ +Please follow our project's code of conduct while contributing. Treat all contributors and users with respect, and create a positive and inclusive environment for everyone. + +## License ๐Ÿ“„ +The project is licensed under MIT. Make sure to review and comply with the license terms. diff --git a/LEARN.md b/LEARN.md new file mode 100644 index 0000000..539c335 --- /dev/null +++ b/LEARN.md @@ -0,0 +1,91 @@ +# Welcome to OpenTekHub Blockchain Repository ๐Ÿš€ + +This repository allows you to explore cryptocurrency price predictions using JavaScript and an API integration (CoinGecko). The project is designed to help you understand how to fetch and display real-time data, specifically cryptocurrency prices, by integrating external APIs into a web application. + +## ๐ŸŒŸ What You Will Learn: +- HTML Structure: Basic layout of a web application. +- JavaScript API Integration: How to fetch data from external APIs (CoinGecko). +- CSS Styling: Applying modern styles with a clean design using Flexbox and responsive layouts. +- Interactive UI: Implementing input-based suggestions and dynamic content updates. +- Predict Cryptocurrency Prices: Learn how to predict and display live cryptocurrency prices based on user input. + +## ๐Ÿ› ๏ธ Prerequisites: +Basic understanding of HTML, CSS, and JavaScript. +A web browser (e.g., Chrome, Firefox). +Text editor (e.g., VS Code, Sublime). + +### Step 1: Clone the Repository +First, you need to clone the repository to your local machine. In your terminal, type the following command: +```terminal + git clone https://github.com//blockchain.git +``` + +### Step 2: Understand the Project Structure +Once cloned, explore the folder structure: + +- index.html: The main HTML page for your web application. +- styles.css: Contains all the styling for your application. +- script.js: Includes the JavaScript logic to fetch cryptocurrency prices and handle user input. + + +### Step 3: Setting Up the HTML +In the index.html file, the structure of the webpage is defined. This includes: + +- A header for the project title. +- A crypto price prediction section with input and a button to fetch prices. +- Repository Information with a link to the GitHub repository. + +You donโ€™t need to change anything here unless you want to add more features. + +### Step 4: Style Your Webpage (CSS) +The styles in styles.css make your web app look modern and responsive. + +Key points: + +- The gradient background and clean typography provide a sleek look. +- Responsive design using media queries ensures the app works on all devices, from mobile to desktop. + +If you want to experiment with the styles, open styles.css and modify. + +### Step 5: JavaScript Logic (API Integration) +Now, the core part! The script.js file contains JavaScript code that fetches cryptocurrency prices using the CoinGecko API and displays them dynamically on the webpage. + +- Crypto Suggestions: As the user types a symbol, suggestions are shown. +- API Fetching: After clicking "Predict Price", it fetches the price from the CoinGecko API. + +Here's the key JavaScript code for fetching the price: + +```terminal + fetch(`https://api.coingecko.com/api/v3/simple/price?ids=${crypto}&vs_currencies=usd`) + .then(response => response.json()) + .then(data => { + document.getElementById("price").innerText = "$" + data[crypto].usd; + }) + .catch(error => { + console.error("Error:", error); + }); +``` +### Step 6: Testing the Application +To see the application in action: + +- Open index.html in your browser (double-click the file). +- Type a cryptocurrency symbol (e.g., BTC for Bitcoin, ETH for Ethereum). +- Click "Predict Price" to see the current price. + +### Step 7: Expanding the Project +Here are some ideas to expand the project: + +- Add more cryptocurrencies to the cryptoMap object in script.js. +- Enhance the UI with more visuals, such as cryptocurrency logos or charts. +- Improve Error Handling by providing better feedback if the API fails or the symbol isn't valid. + + +### ๐ŸŽ“ Additional Resources: +- [CoinGecko API Docs](https://docs.coingecko.com/reference/introduction) - Learn more about the cryptocurrency data API. +- [JavaScript Fetch API](https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API/Using_Fetch) - Documentation for making HTTP requests in JavaScript. + +Feel free to ask questions and contribute to the project! ๐Ÿ‘ฉโ€๐Ÿ’ป Happy Learning! โœจ + +## ๐Ÿ™ Support + +This project needs a โญ๏ธ from you. Don't forget to leave a star โญ๏ธ diff --git a/README.md b/README.md index d16b899..602cfc8 100644 --- a/README.md +++ b/README.md @@ -15,12 +15,46 @@ This repository focuses on building and implementing cryptocurrency features lik - **Cryptocurrency Price Prediction:** A feature that predicts the prices of the latest cryptocurrencies. ### Contribution guidelines -- Switch to the gh-pages branch all the changes need to be done in the gh-pages branch -- Fork the repo of gh-pages branch -- And then clone the forked repo into ur system using the git clone command -- And then make the changes and then commit back the changes to your forked repo -- And then make a pull request addressing the issue -- We will make the commit based upon our requirments and the quality of your code or changes + +1. **Switch to the gh-pages branch**: Click on the current branch name at the top of the window to open the Branch dropdown menu. Locate and click on the gh-pages branch to switch to it. + +2. **Fork the Repository**: + Click on the "Fork" button at the top right of the repository page to create your own copy of the project. + +3. **Clone the Forked Repository**: + - Clone your forked repository to your local machine using the following command (replace with your GitHub username): + - ```terminal + git clone git clone https://github.com//blockchain.git + ``` + +4. **Make changes:** + - Navigate to the project directory + - ```terminal + cd blockchain + ``` + - Make your desired changes, whether itโ€™s fixing bugs, adding features, or improving documentation. + +5. **Commit Your Changes:** + - After making your changes, add and commit them to your local repository: + - ```terminal + git add . + git commit -m "Brief description of your changes" + ``` + +6. **Push Changes to Your Fork:** + - Push your changes back to your forked repository on GitHub: + - ```terminal + git push origin gh-pages + ``` + +7. **Create a Pull Request:** +Go to the original repository (OpenTekHub/blockchain) on GitHub and youโ€™ll see a notification to create a pull request. Click on "Compare & pull request" to submit your changes for review. + +8. **Address Feedback:** +Be prepared to address any feedback from the maintainers regarding your pull request. We value quality contributions and may ask for revisions. + +9. **Star the Repository and Follow the Organization:** +Donโ€™t forget to star โญ the repository and follow the [OpenTekHub](https://github.com/OpenTekHub) organization to stay updated with our projects and contributions! ## Getting Started @@ -28,4 +62,10 @@ This repository focuses on building and implementing cryptocurrency features lik - **Explore**: Take a look at our [live website](https://opentekhub.github.io/blockchain/) to get a feel for the project. - **Check out the issues**: We frequently update the [Issues](https://github.com/OpenTekHub/blockchain/issues) section with bugs, features, and other contributions we need help with. - **Contact us**: If you need assistance or have any questions, feel free to reach out by opening a new issue or emailing the maintainers. +- + +## Contributors + +Big thanks to all the contributors! ๐ŸŽ‰ + diff --git a/updated ui&ux interface b/updated ui&ux interface new file mode 100644 index 0000000..81c416d --- /dev/null +++ b/updated ui&ux interface @@ -0,0 +1,206 @@ + + + Open Tek Hub + + + + + +

OPENTEK HUB

+
+ Home + About Us + FAQs + Contact Us +
+
+
+ + + +
+

CONCLUSION

+
+
+

Supposed Price

+ +

BTC $31,671.45 +5.4%

+
+
+

Starting Investment

+

USD 10,500.00

+

BTC 2.5184

+ BUY CRYPTO +
+
+

Supposed Profit

+ +

+ $1994.16

+

for 45 days

+
+
+
+ + +
+

About Us

+

Welcome to OpenTek Hub, your number one source for all things crypto. We're dedicated to providing you the very best of cryptocurrency investment insights, with an emphasis on reliability, customer service, and uniqueness.

+

Founded in 2023, OpenTek Hub has come a long way from its beginnings. When we first started out, our passion for crypto investment drove us to start our own business.

+

We hope you enjoy our products as much as we enjoy offering them to you. If you have any questions or comments, please don't hesitate to contact us.

+
+ +
+

FAQs

+
+

What is cryptocurrency?

+

Cryptocurrency is a type of digital or virtual currency that uses cryptography for security. It is decentralized and typically operates on a technology called blockchain.How do I start investing in cryptocurrency? +

To start investing in cryptocurrency, you need to choose a reliable exchange, create an account, and deposit funds. From there, you can buy and trade various cryptocurrencies.

+

Is cryptocurrency a safe investment?

+

Cryptocurrency investments come with risks, just like any other investment. It's important to do thorough research and understand the market before investing.

+

How can I track my cryptocurrency investments?

+

You can track your cryptocurrency investments using various portfolio tracking apps and tools that provide real-time updates on prices and market trends.

+
+
+ + + +