refactor stock list page
This commit is contained in:
parent
7af34469f4
commit
749acfef7c
@ -380,6 +380,7 @@
|
|||||||
score: "AI Score",
|
score: "AI Score",
|
||||||
researchAndDevelopmentExpenses: "R&D",
|
researchAndDevelopmentExpenses: "R&D",
|
||||||
counter: "Ratings Count",
|
counter: "Ratings Count",
|
||||||
|
rsi: "RSI",
|
||||||
// Add more key-label mappings here as needed
|
// Add more key-label mappings here as needed
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|||||||
@ -166,6 +166,22 @@
|
|||||||
title: "All Active REITs on the US Stock Market",
|
title: "All Active REITs on the US Stock Market",
|
||||||
link: "/list/reit-stocks",
|
link: "/list/reit-stocks",
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
title: "FAANG Companies",
|
||||||
|
link: "/list/faang",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "Actively Traded Penny Stocks",
|
||||||
|
link: "/list/penny-stocks",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "Oversold Stocks",
|
||||||
|
link: "/list/oversold-stocks",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "Overbought Stocks",
|
||||||
|
link: "/list/overbought-stocks",
|
||||||
|
},
|
||||||
];
|
];
|
||||||
|
|
||||||
navigation = [...navigationIndustry, ...navigation];
|
navigation = [...navigationIndustry, ...navigation];
|
||||||
|
|||||||
@ -1,554 +1,302 @@
|
|||||||
<!--Start Market Cap Group-->
|
<!--Start Market Cap Group-->
|
||||||
|
|
||||||
<div class="container mx-auto pt-3 pl-2">
|
<div class="text-white">
|
||||||
<div class="grid grid-cols-1 sm:grid-cols-2">
|
<h2 class="mb-2 text-xl font-bold">Market Cap Groups</h2>
|
||||||
<!-- Column 1 -->
|
<ul
|
||||||
<div class="mb-4">
|
class="list-outside list-disc space-y-1 p-1 pl-6 md:columns-2 md:gap-x-8 md:text-lg"
|
||||||
<h2 class="text-xl sm:text-2xl text-white font-bold mb-3">
|
>
|
||||||
Market Cap Groups
|
<li>
|
||||||
</h2>
|
<a
|
||||||
<ul class="list-disc space-y-4 sm:space-y-1 pl-5">
|
class="text-blue-400 sm:hover:text-white"
|
||||||
<li class="mb-2 cursor-pointer">
|
href="/list/market-cap/mega-cap-stocks">Mega-Cap Stocks</a
|
||||||
<a
|
>
|
||||||
href="/list/market-cap/mega-cap-stocks"
|
</li>
|
||||||
class="sm:hover:text-white text-blue-400 text-lg">Mega-Cap Stocks</a
|
<li>
|
||||||
>
|
<a
|
||||||
</li>
|
class="text-blue-400 sm:hover:text-white"
|
||||||
<li class="mb-2 cursor-pointer">
|
href="/list/market-cap/large-cap-stocks">Large-Cap Stocks</a
|
||||||
<a
|
>
|
||||||
href="/list/market-cap/large-cap-stocks"
|
</li>
|
||||||
class="sm:hover:text-white text-blue-400 text-lg"
|
<li>
|
||||||
>Large-Cap Stocks</a
|
<a
|
||||||
>
|
class="text-blue-400 sm:hover:text-white"
|
||||||
</li>
|
href="/list/market-cap/mid-cap-stocks">Mid-Cap Stocks</a
|
||||||
<li class="mb-2 cursor-pointer">
|
>
|
||||||
<a
|
</li>
|
||||||
href="/list/market-cap/mid-cap-stocks"
|
<li class="">
|
||||||
class="sm:hover:text-white text-blue-400 text-lg">Mid-Cap Stocks</a
|
<a
|
||||||
>
|
class="text-blue-400 sm:hover:text-white"
|
||||||
</li>
|
href="/list/market-cap/small-cap-stocks">Small-Cap Stocks</a
|
||||||
|
>
|
||||||
<li class="mb-2 cursor-pointer sm:hidden">
|
</li>
|
||||||
<a
|
<li class="">
|
||||||
href="/list/market-cap/small-cap-stocks"
|
<a
|
||||||
class="sm:hover:text-white text-blue-400 text-lg"
|
class="text-blue-400 sm:hover:text-white"
|
||||||
>Small-Cap Stocks</a
|
href="/list/market-cap/micro-cap-stocks">Micro-Cap Stocks</a
|
||||||
>
|
>
|
||||||
</li>
|
</li>
|
||||||
<li class="mb-2 cursor-pointer sm:hidden">
|
<li class="">
|
||||||
<a
|
<a
|
||||||
href="/list/market-cap/micro-cap-stocks"
|
class="text-blue-400 sm:hover:text-white"
|
||||||
class="sm:hover:text-white text-blue-400 text-lg"
|
href="/list/market-cap/nano-cap-stocks">Nano-Cap Stocks</a
|
||||||
>Micro-Cap Stocks</a
|
>
|
||||||
>
|
</li>
|
||||||
</li>
|
</ul>
|
||||||
<li class="mb-2 cursor-pointer sm:hidden">
|
|
||||||
<a
|
|
||||||
href="/list/market-cap/nano-cap-stocks"
|
|
||||||
class="sm:hover:text-white text-blue-400 text-lg">Nano-Cap Stocks</a
|
|
||||||
>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- Column 2 -->
|
|
||||||
<div class="mt-10 hidden sm:block">
|
|
||||||
<ul class="list-disc space-y-1 pl-5">
|
|
||||||
<li class="mb-2 cursor-pointer">
|
|
||||||
<a
|
|
||||||
href="/list/market-cap/small-cap-stocks"
|
|
||||||
class="sm:hover:text-white text-blue-400 text-lg"
|
|
||||||
>Small-Cap Stocks</a
|
|
||||||
>
|
|
||||||
</li>
|
|
||||||
<li class="mb-2 cursor-pointer">
|
|
||||||
<a
|
|
||||||
href="/list/market-cap/micro-cap-stocks"
|
|
||||||
class="sm:hover:text-white text-blue-400 text-lg"
|
|
||||||
>Micro-Cap Stocks</a
|
|
||||||
>
|
|
||||||
</li>
|
|
||||||
<li class="mb-2 cursor-pointer">
|
|
||||||
<a
|
|
||||||
href="/list/market-cap/nano-cap-stocks"
|
|
||||||
class="sm:hover:text-white text-blue-400 text-lg">Nano-Cap Stocks</a
|
|
||||||
>
|
|
||||||
</li>
|
|
||||||
<!-- ...other list items -->
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<!--End Market Cap Group-->
|
<!--End Market Cap Group-->
|
||||||
|
|
||||||
<!--Start Exchange Group-->
|
<div class="text-white">
|
||||||
|
<h2 class="mb-2 text-xl font-bold pt-10">Exchange Groups</h2>
|
||||||
<div class="container mx-auto pt-10 pl-4">
|
<ul
|
||||||
<div class="grid grid-cols-1 sm:grid-cols-2">
|
class="list-outside list-disc space-y-1 p-1 pl-6 md:columns-2 md:gap-x-8 md:text-lg"
|
||||||
<div class="mb-4">
|
>
|
||||||
<h2 class="text-xl sm:text-2xl text-white font-bold mb-3">
|
<li>
|
||||||
Exchange Groups
|
<a class="text-blue-400 sm:hover:text-white" href="/list/exchange/nasdaq"
|
||||||
</h2>
|
>Listed on NASDAQ</a
|
||||||
<ul class="list-disc space-y-1 pl-3">
|
>
|
||||||
<li class="mb-2 cursor-pointer">
|
</li>
|
||||||
<a
|
<li>
|
||||||
href="/list/exchange/nasdaq"
|
<a class="text-blue-400 sm:hover:text-white" href="/list/exchange/nyse"
|
||||||
class="sm:hover:text-white text-blue-400 text-lg"
|
>Listed on NYSE</a
|
||||||
>Listed on NASDAQ</a
|
>
|
||||||
>
|
</li>
|
||||||
</li>
|
<li>
|
||||||
<li class="mb-2 cursor-pointer">
|
<a class="text-blue-400 sm:hover:text-white" href="/list/exchange/amex"
|
||||||
<a
|
>Listed on AMEX</a
|
||||||
href="/list/exchange/nyse"
|
>
|
||||||
class="sm:hover:text-white text-blue-400 text-lg">Listed on NYSE</a
|
</li>
|
||||||
>
|
</ul>
|
||||||
</li>
|
|
||||||
<li class="mb-2 cursor-pointer sm:hidden">
|
|
||||||
<a
|
|
||||||
href="/list/exchange/amex"
|
|
||||||
class="sm:hover:text-white text-blue-400 text-lg">Listed on AMEX</a
|
|
||||||
>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- Column 2 -->
|
|
||||||
<div class="mt-10 hidden sm:block">
|
|
||||||
<ul class="list-disc space-y-1 pl-5">
|
|
||||||
<li class="mb-2 cursor-pointer">
|
|
||||||
<a
|
|
||||||
href="/list/exchange/amex"
|
|
||||||
class="sm:hover:text-white text-blue-400 text-lg">Listed on AMEX</a
|
|
||||||
>
|
|
||||||
</li>
|
|
||||||
|
|
||||||
<!-- ...other list items -->
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<!--End Exchange Group-->
|
|
||||||
|
|
||||||
<!--Start Index Group-->
|
<!--Start Index Group-->
|
||||||
|
|
||||||
<div class="container mx-auto pt-10 pl-4">
|
<div class="text-white">
|
||||||
<div class="grid grid-cols-1 sm:grid-cols-2">
|
<h2 class="mb-2 text-xl font-bold pt-10">Index Groups</h2>
|
||||||
<div class="mb-4">
|
<ul
|
||||||
<h2 class="text-xl sm:text-2xl text-white font-bold mb-3">
|
class="list-outside list-disc space-y-1 p-1 pl-6 md:columns-2 md:gap-x-8 md:text-lg"
|
||||||
Index Groups
|
>
|
||||||
</h2>
|
<li>
|
||||||
<ul class="list-disc space-y-1 pl-3">
|
<a class="text-blue-400 sm:hover:text-white" href="/list/index/dowjones"
|
||||||
<li class="mb-2 cursor-pointer">
|
>Listed on Dow Jones</a
|
||||||
<a
|
>
|
||||||
href="/list/index/dowjones"
|
</li>
|
||||||
class="sm:hover:text-white text-blue-400 text-lg"
|
<li>
|
||||||
>
|
<a class="text-blue-400 sm:hover:text-white" href="/list/index/nasdaq100"
|
||||||
Listed on Dow Jones
|
>Listed on NASDAQ 100</a
|
||||||
</a>
|
>
|
||||||
</li>
|
</li>
|
||||||
<li class="mb-2 cursor-pointer">
|
<li>
|
||||||
<a
|
<a class="text-blue-400 sm:hover:text-white" href="/list/index/sp500"
|
||||||
href="/list/index/nasdaq100"
|
>Listed on S&P 500</a
|
||||||
class="sm:hover:text-white text-blue-400 text-lg"
|
>
|
||||||
>
|
</li>
|
||||||
Listed on NASDAQ 100
|
</ul>
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="mb-2 cursor-pointer sm:hidden">
|
|
||||||
<a
|
|
||||||
href="/list/index/sp500"
|
|
||||||
class="sm:hover:text-white text-blue-400 text-lg"
|
|
||||||
>
|
|
||||||
Listed on S&P 500
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- Column 2 -->
|
|
||||||
<div class="mt-10 hidden sm:block">
|
|
||||||
<ul class="list-disc space-y-1 pl-5">
|
|
||||||
<li class="mb-2 cursor-pointer">
|
|
||||||
<a
|
|
||||||
href="/list/index/sp500"
|
|
||||||
class="sm:hover:text-white text-blue-400 text-lg"
|
|
||||||
>
|
|
||||||
Listed on S&P 500
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<!-- ...other list items -->
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<!--End Index Group-->
|
<!--End Index Group-->
|
||||||
|
|
||||||
|
<!--Start Other Lists-->
|
||||||
|
|
||||||
|
<div class="text-white">
|
||||||
|
<h2 class="mb-2 text-xl font-bold pt-10">Other Lists</h2>
|
||||||
|
<ul
|
||||||
|
class="list-outside list-disc space-y-1 p-1 pl-6 md:columns-2 md:gap-x-8 md:text-lg"
|
||||||
|
>
|
||||||
|
<li>
|
||||||
|
<a class="text-blue-400 sm:hover:text-white" href="/list/faang">FAANG</a>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<a
|
||||||
|
class="text-blue-400 sm:hover:text-white"
|
||||||
|
href="/list/magnificent-seven">Magnificent Seven</a
|
||||||
|
>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<a
|
||||||
|
class="text-blue-400 sm:hover:text-white"
|
||||||
|
href="/list/dividend/dividend-kings">Dividend Kings</a
|
||||||
|
>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<a
|
||||||
|
class="text-blue-400 sm:hover:text-white"
|
||||||
|
href="/list/dividend/dividend-aristocrats">Dividend Aristocrats</a
|
||||||
|
>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li>
|
||||||
|
<a class="text-blue-400 sm:hover:text-white" href="/list/penny-stocks"
|
||||||
|
>Penny Stocks</a
|
||||||
|
>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<a class="text-blue-400 sm:hover:text-white" href="/list/oversold-stocks/"
|
||||||
|
>Oversold Stocks</a
|
||||||
|
>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li>
|
||||||
|
<a
|
||||||
|
class="text-blue-400 sm:hover:text-white"
|
||||||
|
href="/list/overbought-stocks/">Overbought Stocks</a
|
||||||
|
>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<a class="text-blue-400 sm:hover:text-white" href="/list/reit-stocks"
|
||||||
|
>All REITs</a
|
||||||
|
>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!--End Other Lists-->
|
||||||
|
|
||||||
<!--Start Non-US Stocks Listed on US Exchanges-->
|
<!--Start Non-US Stocks Listed on US Exchanges-->
|
||||||
|
<div class="text-white">
|
||||||
<div class="container mx-auto pt-10 pl-4">
|
<h2 class="mb-2 text-xl font-bold pt-10">
|
||||||
<div class="grid grid-cols-1 sm:grid-cols-2">
|
Non-US Stocks Listed on US Exchanges
|
||||||
<div class="mb-4">
|
</h2>
|
||||||
<h2 class="text-xl sm:text-2xl text-white font-bold mb-3">
|
<ul
|
||||||
Non-US Stocks Listed on US Exchangess
|
class="list-outside list-disc space-y-1 p-1 pl-6 md:columns-2 md:gap-x-8 md:text-lg"
|
||||||
</h2>
|
>
|
||||||
<ul class="list-disc space-y-1 pl-3">
|
<li>
|
||||||
<li class="mb-2 cursor-pointer">
|
<a class="text-blue-400 sm:hover:text-white" href="/list/country/ca"
|
||||||
<a
|
>Canada</a
|
||||||
href="/list/country/ca"
|
>
|
||||||
class="sm:hover:text-white text-blue-400 text-lg"
|
</li>
|
||||||
>
|
<li>
|
||||||
Canada
|
<a class="text-blue-400 sm:hover:text-white" href="/list/country/cn"
|
||||||
</a>
|
>China</a
|
||||||
</li>
|
>
|
||||||
<li class="mb-2 cursor-pointer">
|
</li>
|
||||||
<a
|
<li>
|
||||||
href="/list/country/cn"
|
<a class="text-blue-400 sm:hover:text-white" href="/list/country/in"
|
||||||
class="sm:hover:text-white text-blue-400 text-lg"
|
>India</a
|
||||||
>
|
>
|
||||||
China
|
</li>
|
||||||
</a>
|
<li>
|
||||||
</li>
|
<a class="text-blue-400 sm:hover:text-white" href="/list/country/jp"
|
||||||
<li class="mb-2 cursor-pointer">
|
>Japan</a
|
||||||
<a
|
>
|
||||||
href="/list/country/in"
|
</li>
|
||||||
class="sm:hover:text-white text-blue-400 text-lg"
|
<li>
|
||||||
>
|
<a class="text-blue-400 sm:hover:text-white" href="/list/country/de"
|
||||||
India
|
>Germany</a
|
||||||
</a>
|
>
|
||||||
</li>
|
</li>
|
||||||
<li class="mb-2 cursor-pointer">
|
<li>
|
||||||
<a
|
<a class="text-blue-400 sm:hover:text-white" href="/list/country/il"
|
||||||
href="/list/country/jp"
|
>Israel</a
|
||||||
class="sm:hover:text-white text-blue-400 text-lg"
|
>
|
||||||
>
|
</li>
|
||||||
Japan
|
<li>
|
||||||
</a>
|
<a class="text-blue-400 sm:hover:text-white" href="/list/country/gb"
|
||||||
</li>
|
>United Kingdom</a
|
||||||
|
>
|
||||||
<li class="mb-2 cursor-pointer sm:hidden">
|
</li>
|
||||||
<a
|
</ul>
|
||||||
href="/list/country/de"
|
|
||||||
class="sm:hover:text-white text-blue-400 text-lg"
|
|
||||||
>
|
|
||||||
Germany
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="mb-2 cursor-pointer sm:hidden">
|
|
||||||
<a
|
|
||||||
href="/list/country/il"
|
|
||||||
class="sm:hover:text-white text-blue-400 text-lg"
|
|
||||||
>
|
|
||||||
Israel
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="mb-2 cursor-pointer sm:hidden">
|
|
||||||
<a
|
|
||||||
href="/list/country/gb"
|
|
||||||
class="sm:hover:text-white text-blue-400 text-lg"
|
|
||||||
>
|
|
||||||
United Kingdom
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="mt-[75px] hidden sm:block">
|
|
||||||
<ul class="list-disc space-y-1 pl-5">
|
|
||||||
<li class="mb-2 cursor-pointer">
|
|
||||||
<a
|
|
||||||
href="/list/country/de"
|
|
||||||
class="sm:hover:text-white text-blue-400 text-lg"
|
|
||||||
>
|
|
||||||
Germany
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="mb-2 cursor-pointer">
|
|
||||||
<a
|
|
||||||
href="/list/country/il"
|
|
||||||
class="sm:hover:text-white text-blue-400 text-lg"
|
|
||||||
>
|
|
||||||
Israel
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="mb-2 cursor-pointer">
|
|
||||||
<a
|
|
||||||
href="/list/country/gb"
|
|
||||||
class="sm:hover:text-white text-blue-400 text-lg"
|
|
||||||
>
|
|
||||||
United Kingdom
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<!--End Non-US Stocks Listed on US Exchanges-->
|
<!--End Non-US Stocks Listed on US Exchanges-->
|
||||||
|
|
||||||
<!--Start Sector Group-->
|
<!--Start Sector Group-->
|
||||||
<div class="container mx-auto pt-10 pl-4">
|
<div class="text-white">
|
||||||
<div class="grid grid-cols-1 sm:grid-cols-2">
|
<h2 class="mb-2 text-xl font-bold pt-10">Sector Groups</h2>
|
||||||
<div class="mb-4">
|
<ul
|
||||||
<h2 class="text-xl sm:text-2xl text-white font-bold mb-3">
|
class="list-outside list-disc space-y-1 p-1 pl-6 md:columns-2 md:gap-x-8 md:text-lg"
|
||||||
Sector Groups
|
>
|
||||||
</h2>
|
<li>
|
||||||
<ul class="list-disc space-y-1 pl-3">
|
<a class="text-blue-400 sm:hover:text-white" href="/list/sector/financial"
|
||||||
<li class="mb-2 cursor-pointer">
|
>Financials</a
|
||||||
<a
|
>
|
||||||
href="/list/sector/financial"
|
</li>
|
||||||
class="sm:hover:text-white text-blue-400 text-lg"
|
<li>
|
||||||
>
|
<a
|
||||||
Financials
|
class="text-blue-400 sm:hover:text-white"
|
||||||
</a>
|
href="/list/sector/healthcare">Healthcare</a
|
||||||
</li>
|
>
|
||||||
<li class="mb-2 cursor-pointer">
|
</li>
|
||||||
<a
|
<li>
|
||||||
href="/list/sector/healthcare"
|
<a
|
||||||
class="sm:hover:text-white text-blue-400 text-lg"
|
class="text-blue-400 sm:hover:text-white"
|
||||||
>
|
href="/list/sector/technology">Technology</a
|
||||||
Healthcare
|
>
|
||||||
</a>
|
</li>
|
||||||
</li>
|
<li>
|
||||||
<li class="mb-2 cursor-pointer">
|
<a
|
||||||
<a
|
class="text-blue-400 sm:hover:text-white"
|
||||||
href="/list/sector/technology"
|
href="/list/sector/industrials">Industrials</a
|
||||||
class="sm:hover:text-white text-blue-400 text-lg"
|
>
|
||||||
>
|
</li>
|
||||||
Technology
|
<li>
|
||||||
</a>
|
<a class="text-blue-400 sm:hover:text-white" href="/list/sector/energy"
|
||||||
</li>
|
>Energy</a
|
||||||
<li class="mb-2 cursor-pointer">
|
>
|
||||||
<a
|
</li>
|
||||||
href="/list/sector/industrials"
|
<li>
|
||||||
class="sm:hover:text-white text-blue-400 text-lg"
|
<a class="text-blue-400 sm:hover:text-white" href="/list/sector/utilities"
|
||||||
>
|
>Utilities</a
|
||||||
Industrials
|
>
|
||||||
</a>
|
</li>
|
||||||
</li>
|
<li>
|
||||||
<li class="mb-2 cursor-pointer">
|
<a
|
||||||
<a
|
class="text-blue-400 sm:hover:text-white"
|
||||||
href="/list/sector/energy"
|
href="/list/sector/consumer-cyclical">Consumer Cyclical</a
|
||||||
class="sm:hover:text-white text-blue-400 text-lg"
|
>
|
||||||
>
|
</li>
|
||||||
Energy
|
<li>
|
||||||
</a>
|
<a
|
||||||
</li>
|
class="text-blue-400 sm:hover:text-white"
|
||||||
<li class="mb-2 cursor-pointer">
|
href="/list/sector/real-estate">Real Estate</a
|
||||||
<a
|
>
|
||||||
href="/list/sector/utilities"
|
</li>
|
||||||
class="sm:hover:text-white text-blue-400 text-lg"
|
<li>
|
||||||
>
|
<a
|
||||||
Utilities
|
class="text-blue-400 sm:hover:text-white"
|
||||||
</a>
|
href="/list/sector/basic-materials">Basic Materials</a
|
||||||
</li>
|
>
|
||||||
|
</li>
|
||||||
<li class="mb-2 cursor-pointer sm:hidden">
|
<li>
|
||||||
<a
|
<a
|
||||||
href="/list/sector/consumer-cyclical"
|
class="text-blue-400 sm:hover:text-white"
|
||||||
class="sm:hover:text-white text-blue-400 text-lg"
|
href="/list/sector/communication-services">Communication Services</a
|
||||||
>
|
>
|
||||||
Consumer Cyclical
|
</li>
|
||||||
</a>
|
<li>
|
||||||
</li>
|
<a
|
||||||
<li class="mb-2 cursor-pointer sm:hidden">
|
class="text-blue-400 sm:hover:text-white"
|
||||||
<a
|
href="/list/sector/consumer-defensive">Consumer Defensive</a
|
||||||
href="/list/sector/real-estate"
|
>
|
||||||
class="sm:hover:text-white text-blue-400 text-lg"
|
</li>
|
||||||
>
|
</ul>
|
||||||
Real Estate
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="mb-2 cursor-pointer sm:hidden">
|
|
||||||
<a
|
|
||||||
href="/list/sector/basic-materials"
|
|
||||||
class="sm:hover:text-white text-blue-400 text-lg"
|
|
||||||
>
|
|
||||||
Basic Materials
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="mb-2 cursor-pointer sm:hidden">
|
|
||||||
<a
|
|
||||||
href="/list/sector/communication-services"
|
|
||||||
class="sm:hover:text-white text-blue-400 text-lg"
|
|
||||||
>
|
|
||||||
Communication Services
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="mb-2 cursor-pointer sm:hidden">
|
|
||||||
<a
|
|
||||||
href="/list/sector/consumer-defensive"
|
|
||||||
class="sm:hover:text-white text-blue-400 text-lg"
|
|
||||||
>
|
|
||||||
Consumer Defensive
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- Column 2 -->
|
|
||||||
<div class="mt-11 hidden sm:block">
|
|
||||||
<ul class="list-disc space-y-1 pl-5">
|
|
||||||
<li class="mb-2 cursor-pointer">
|
|
||||||
<a
|
|
||||||
href="/list/sector/consumer-cyclical"
|
|
||||||
class="sm:hover:text-white text-blue-400 text-lg"
|
|
||||||
>
|
|
||||||
Consumer Cyclical
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="mb-2 cursor-pointer">
|
|
||||||
<a
|
|
||||||
href="/list/sector/real-estate"
|
|
||||||
class="sm:hover:text-white text-blue-400 text-lg"
|
|
||||||
>
|
|
||||||
Real Estate
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="mb-2 cursor-pointer">
|
|
||||||
<a
|
|
||||||
href="/list/sector/basic-materials"
|
|
||||||
class="sm:hover:text-white text-blue-400 text-lg"
|
|
||||||
>
|
|
||||||
Basic Materials
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="mb-2 cursor-pointer">
|
|
||||||
<a
|
|
||||||
href="/list/sector/communication-services"
|
|
||||||
class="sm:hover:text-white text-blue-400 text-lg"
|
|
||||||
>
|
|
||||||
Communication Services
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="mb-2 cursor-pointer">
|
|
||||||
<a
|
|
||||||
href="/list/sector/consumer-defensive"
|
|
||||||
class="sm:hover:text-white text-blue-400 text-lg"
|
|
||||||
>
|
|
||||||
Consumer Defensive
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<!-- ...other list items -->
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<!--End Sector Group-->
|
<!--End Sector Group-->
|
||||||
|
|
||||||
<!--Start ETF Lists-->
|
<!--Start ETF Lists-->
|
||||||
|
|
||||||
<div class="container mx-auto pt-10 pl-4">
|
<div class="text-white">
|
||||||
<div class="grid grid-cols-1 sm:grid-cols-2">
|
<h2 class="mb-2 text-xl font-bold pt-10">ETF Lists</h2>
|
||||||
<div class="mb-4">
|
<ul
|
||||||
<h2 class="text-xl sm:text-2xl text-white font-bold mb-3">ETF Lists</h2>
|
class="list-outside list-disc space-y-1 p-1 pl-6 md:columns-2 md:gap-x-8 md:text-lg"
|
||||||
<ul class="list-disc space-y-1 pl-3">
|
>
|
||||||
<li class="mb-2 cursor-pointer">
|
<li>
|
||||||
<a
|
<a class="text-blue-400 sm:hover:text-white" href="/etf/new-launches"
|
||||||
href="/etf/new-launches"
|
>New Launches</a
|
||||||
class="sm:hover:text-white text-blue-400 text-lg"
|
>
|
||||||
>
|
</li>
|
||||||
New Launches
|
<li>
|
||||||
</a>
|
<a class="text-blue-400 sm:hover:text-white" href="/etf/etf-providers"
|
||||||
</li>
|
>ETF Providers</a
|
||||||
<li class="mb-2 cursor-pointer">
|
>
|
||||||
<a
|
</li>
|
||||||
href="/etf/etf-providers"
|
<li>
|
||||||
class="sm:hover:text-white text-blue-400 text-lg"
|
<a class="text-blue-400 sm:hover:text-white" href="/list/bitcoin-etfs"
|
||||||
>
|
>Bitcoin ETFs</a
|
||||||
ETF Providers
|
>
|
||||||
</a>
|
</li>
|
||||||
</li>
|
</ul>
|
||||||
<li class="mb-2 cursor-pointer sm:hidden">
|
|
||||||
<a
|
|
||||||
href="/list/bitcoin-etfs"
|
|
||||||
class="sm:hover:text-white text-blue-400 text-lg"
|
|
||||||
>
|
|
||||||
Bitcoin ETFs
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- Column 2 -->
|
|
||||||
<div class="mt-11 hidden sm:block">
|
|
||||||
<ul class="list-disc space-y-1 pl-5">
|
|
||||||
<li class="mb-2 cursor-pointer">
|
|
||||||
<a
|
|
||||||
href="/list/bitcoin-etfs"
|
|
||||||
class="sm:hover:text-white text-blue-400 text-lg"
|
|
||||||
>
|
|
||||||
Bitcoin ETFs
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<!-- ...other list items -->
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<!--End ETF Lists-->
|
<!--End ETF Lists-->
|
||||||
|
|
||||||
<!--Start Other Lists-->
|
|
||||||
|
|
||||||
<div class="container mx-auto pt-10 pl-4">
|
|
||||||
<div class="grid grid-cols-1 sm:grid-cols-2">
|
|
||||||
<div class="mb-4">
|
|
||||||
<h2 class="text-xl sm:text-2xl text-white font-bold mb-3">Other Lists</h2>
|
|
||||||
<ul class="list-disc space-y-1 pl-3">
|
|
||||||
<li class="mb-2 cursor-pointer">
|
|
||||||
<a
|
|
||||||
href="/list/magnificent-seven"
|
|
||||||
class="sm:hover:text-white text-blue-400 text-lg"
|
|
||||||
>
|
|
||||||
Magnificent Seven
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="mb-2 cursor-pointer">
|
|
||||||
<a
|
|
||||||
href="/list/dividend/dividend-kings"
|
|
||||||
class="sm:hover:text-white text-blue-400 text-lg"
|
|
||||||
>
|
|
||||||
Dividend Kings
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="mb-2 cursor-pointer">
|
|
||||||
<a
|
|
||||||
href="/list/dividend/dividend-aristocrats"
|
|
||||||
class="sm:hover:text-white text-blue-400 text-lg"
|
|
||||||
>
|
|
||||||
Dividend Aristocrats
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="mb-2 cursor-pointer sm:hidden">
|
|
||||||
<a
|
|
||||||
href="/list/reit-stocks"
|
|
||||||
class="sm:hover:text-white text-blue-400 text-lg"
|
|
||||||
>
|
|
||||||
All REITs
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- Column 2 -->
|
|
||||||
<div class="mt-10 hidden sm:block">
|
|
||||||
<ul class="list-disc space-y-1 pl-5">
|
|
||||||
<li class="mb-2 cursor-pointer">
|
|
||||||
<a
|
|
||||||
href="/list/reit-stocks"
|
|
||||||
class="sm:hover:text-white text-blue-400 text-lg"
|
|
||||||
>
|
|
||||||
All REITs
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
|
|
||||||
<!-- ...other list items -->
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!--End Other Lists-->
|
|
||||||
|
|||||||
23
src/routes/list/faang/+page.server.ts
Normal file
23
src/routes/list/faang/+page.server.ts
Normal file
@ -0,0 +1,23 @@
|
|||||||
|
export const load = async ({ locals }) => {
|
||||||
|
const getFAANG = async () => {
|
||||||
|
const { apiKey, apiURL } = locals;
|
||||||
|
const postData = {'filterList': 'faang'}
|
||||||
|
// make the POST request to the endpoint
|
||||||
|
const response = await fetch(apiURL + "/list-category", {
|
||||||
|
method: "POST",
|
||||||
|
headers: {
|
||||||
|
"Content-Type": "application/json",
|
||||||
|
"X-API-KEY": apiKey,
|
||||||
|
},
|
||||||
|
body: JSON.stringify(postData)
|
||||||
|
});
|
||||||
|
|
||||||
|
const output = await response.json();
|
||||||
|
return output;
|
||||||
|
};
|
||||||
|
|
||||||
|
// Make sure to return a promise
|
||||||
|
return {
|
||||||
|
getFAANG: await getFAANG(),
|
||||||
|
};
|
||||||
|
};
|
||||||
70
src/routes/list/faang/+page.svelte
Normal file
70
src/routes/list/faang/+page.svelte
Normal file
@ -0,0 +1,70 @@
|
|||||||
|
<script lang="ts">
|
||||||
|
import { abbreviateNumber } from "$lib/utils";
|
||||||
|
import Table from "$lib/components/Table/Table.svelte";
|
||||||
|
|
||||||
|
export let data;
|
||||||
|
let rawData = data?.getFAANG;
|
||||||
|
|
||||||
|
let totalMarketCap =
|
||||||
|
rawData?.reduce((total, stock) => total + stock?.marketCap, 0) ?? 0;
|
||||||
|
let totalRevenue =
|
||||||
|
rawData?.reduce((total, stock) => total + stock?.revenue, 0) ?? 0;
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<section class="w-full overflow-hidden m-auto">
|
||||||
|
<div
|
||||||
|
class="w-full border border-gray-600 sm:flex sm:flex-row sm:items-center m-auto text-white bg-[#09090B] sm:rounded-md h-auto p-5 mb-4"
|
||||||
|
>
|
||||||
|
<svg
|
||||||
|
class="w-5 h-5 inline-block sm:mr-2 flex-shrink-0"
|
||||||
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
viewBox="0 0 256 256"
|
||||||
|
><path
|
||||||
|
fill="#fff"
|
||||||
|
d="M128 24a104 104 0 1 0 104 104A104.11 104.11 0 0 0 128 24m-4 48a12 12 0 1 1-12 12a12 12 0 0 1 12-12m12 112a16 16 0 0 1-16-16v-40a8 8 0 0 1 0-16a16 16 0 0 1 16 16v40a8 8 0 0 1 0 16"
|
||||||
|
/></svg
|
||||||
|
>
|
||||||
|
|
||||||
|
The "FAANG" stocks refer to five major U.S. tech companies: Meta (formerly
|
||||||
|
Facebook), Amazon, Apple, Netflix, and Alphabet (Google). Originally
|
||||||
|
popularized by Jim Cramer as "FANG," the list did not initially include
|
||||||
|
Apple.
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div
|
||||||
|
class="mb-4 flex flex-col divide-y divide-gray-600 rounded-md border border-gray-600 sm:grid sm:grid-cols-3 sm:divide-x sm:divide-y-0"
|
||||||
|
>
|
||||||
|
<div class="px-4 py-3 sm:px-2 sm:py-5 md:px-3 lg:p-6">
|
||||||
|
<div class="flex items-center justify-between sm:block">
|
||||||
|
<div class="text-sm font-normal text-white">Total Stocks</div>
|
||||||
|
<div
|
||||||
|
class="mt-1 break-words font-semibold leading-8 text-white tiny:text-lg xs:text-xl sm:text-2xl"
|
||||||
|
>
|
||||||
|
{new Intl.NumberFormat("en")?.format(rawData?.length)}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="px-4 py-3 sm:px-2 sm:py-5 md:px-3 lg:p-6">
|
||||||
|
<div class="flex items-center justify-between sm:block">
|
||||||
|
<div class="text-sm font-normal text-white">Total Market Cap</div>
|
||||||
|
<div
|
||||||
|
class="mt-1 break-words font-semibold leading-8 text-white tiny:text-lg xs:text-xl sm:text-2xl"
|
||||||
|
>
|
||||||
|
{abbreviateNumber(totalMarketCap)}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="px-4 py-3 sm:px-2 sm:py-5 md:px-3 lg:p-6">
|
||||||
|
<div class="flex items-center justify-between sm:block">
|
||||||
|
<div class="text-sm font-normal text-white">Total Revenue</div>
|
||||||
|
<div
|
||||||
|
class="mt-1 break-words font-semibold leading-8 text-white tiny:text-lg xs:text-xl sm:text-2xl"
|
||||||
|
>
|
||||||
|
{abbreviateNumber(totalRevenue)}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<Table {data} {rawData} />
|
||||||
|
</section>
|
||||||
@ -1,14 +1,15 @@
|
|||||||
export const load = async ({ locals }) => {
|
export const load = async ({ locals }) => {
|
||||||
|
|
||||||
const getMagnificentSeven = async () => {
|
const getMagnificentSeven = async () => {
|
||||||
const { apiURL, apiKey } = locals;
|
const { apiKey, apiURL } = locals;
|
||||||
|
const postData = {'filterList': 'magnificent-seven'}
|
||||||
const response = await fetch(apiURL + "/magnificent-seven", {
|
// make the POST request to the endpoint
|
||||||
method: "GET",
|
const response = await fetch(apiURL + "/list-category", {
|
||||||
|
method: "POST",
|
||||||
headers: {
|
headers: {
|
||||||
"Content-Type": "application/json",
|
"Content-Type": "application/json",
|
||||||
"X-API-KEY": apiKey,
|
"X-API-KEY": apiKey,
|
||||||
},
|
},
|
||||||
|
body: JSON.stringify(postData)
|
||||||
});
|
});
|
||||||
|
|
||||||
const output = await response.json();
|
const output = await response.json();
|
||||||
|
|||||||
@ -9,12 +9,6 @@
|
|||||||
rawData?.reduce((total, stock) => total + stock?.marketCap, 0) ?? 0;
|
rawData?.reduce((total, stock) => total + stock?.marketCap, 0) ?? 0;
|
||||||
let totalRevenue =
|
let totalRevenue =
|
||||||
rawData?.reduce((total, stock) => total + stock?.revenue, 0) ?? 0;
|
rawData?.reduce((total, stock) => total + stock?.revenue, 0) ?? 0;
|
||||||
let totalProfits =
|
|
||||||
rawData?.reduce((total, stock) => total + stock?.netIncome, 0) ?? 0;
|
|
||||||
let avgPERatio = (
|
|
||||||
(rawData?.reduce((total, stock) => total + stock?.pe, 0) ?? 0) /
|
|
||||||
rawData?.length
|
|
||||||
)?.toFixed(2);
|
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<section class="w-full overflow-hidden m-auto">
|
<section class="w-full overflow-hidden m-auto">
|
||||||
|
|||||||
26
src/routes/list/overbought-stocks/+page.server.ts
Normal file
26
src/routes/list/overbought-stocks/+page.server.ts
Normal file
@ -0,0 +1,26 @@
|
|||||||
|
export const load = async ({ locals, setHeaders }) => {
|
||||||
|
|
||||||
|
const getOverBoughtStocks = async () => {
|
||||||
|
const { apiKey, apiURL } = locals;
|
||||||
|
const postData = { filterList: 'overbought-stocks' };
|
||||||
|
|
||||||
|
const response = await fetch(apiURL + "/list-category", {
|
||||||
|
method: "POST",
|
||||||
|
headers: {
|
||||||
|
"Content-Type": "application/json",
|
||||||
|
"X-API-KEY": apiKey,
|
||||||
|
},
|
||||||
|
body: JSON.stringify(postData),
|
||||||
|
});
|
||||||
|
|
||||||
|
const output = await response.json();
|
||||||
|
setHeaders({ "cache-control": "public, max-age=60*5" });
|
||||||
|
|
||||||
|
return output;
|
||||||
|
};
|
||||||
|
|
||||||
|
// Make sure to return a promise
|
||||||
|
return {
|
||||||
|
getOverBoughtStocks: await getOverBoughtStocks(),
|
||||||
|
};
|
||||||
|
};
|
||||||
36
src/routes/list/overbought-stocks/+page.svelte
Normal file
36
src/routes/list/overbought-stocks/+page.svelte
Normal file
@ -0,0 +1,36 @@
|
|||||||
|
<script lang="ts">
|
||||||
|
import Table from "$lib/components/Table/Table.svelte";
|
||||||
|
|
||||||
|
export let data;
|
||||||
|
|
||||||
|
const defaultList = [
|
||||||
|
{ name: "RSI", rule: "rsi" },
|
||||||
|
{ name: "Price", rule: "price" },
|
||||||
|
{ name: "% Change", rule: "changesPercentage" },
|
||||||
|
{ name: "Market Cap", rule: "marketCap" },
|
||||||
|
];
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<section class="w-full overflow-hidden m-auto">
|
||||||
|
<div
|
||||||
|
class="w-full sm:flex sm:flex-row sm:items-center m-auto text-gray-100 border border-gray-800 sm:rounded-md h-auto p-5 mb-4"
|
||||||
|
>
|
||||||
|
<svg
|
||||||
|
class="w-5 h-5 inline-block sm:mr-2 flex-shrink-0"
|
||||||
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
viewBox="0 0 256 256"
|
||||||
|
><path
|
||||||
|
fill="#fff"
|
||||||
|
d="M128 24a104 104 0 1 0 104 104A104.11 104.11 0 0 0 128 24m-4 48a12 12 0 1 1-12 12a12 12 0 0 1 12-12m12 112a16 16 0 0 1-16-16v-40a8 8 0 0 1 0-16a16 16 0 0 1 16 16v40a8 8 0 0 1 0 16"
|
||||||
|
/></svg
|
||||||
|
>
|
||||||
|
|
||||||
|
A list of stocks that are "overbought" according to the Relative Strength
|
||||||
|
Index (RSI), which is an indicator often used in technical analysis. An RSI
|
||||||
|
of over 70 on a daily chart is generally used to determine that an asset is
|
||||||
|
overbought and indicates that the stock may soon reverse to the downside.
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Page wrapper -->
|
||||||
|
<Table {data} rawData={data?.getOverBoughtStocks} {defaultList} />
|
||||||
|
</section>
|
||||||
26
src/routes/list/oversold-stocks/+page.server.ts
Normal file
26
src/routes/list/oversold-stocks/+page.server.ts
Normal file
@ -0,0 +1,26 @@
|
|||||||
|
export const load = async ({ locals, setHeaders }) => {
|
||||||
|
|
||||||
|
const getOverSoldStocks = async () => {
|
||||||
|
const { apiKey, apiURL } = locals;
|
||||||
|
const postData = { filterList: 'oversold-stocks' };
|
||||||
|
|
||||||
|
const response = await fetch(apiURL + "/list-category", {
|
||||||
|
method: "POST",
|
||||||
|
headers: {
|
||||||
|
"Content-Type": "application/json",
|
||||||
|
"X-API-KEY": apiKey,
|
||||||
|
},
|
||||||
|
body: JSON.stringify(postData),
|
||||||
|
});
|
||||||
|
|
||||||
|
const output = await response.json();
|
||||||
|
setHeaders({ "cache-control": "public, max-age=60*5" });
|
||||||
|
|
||||||
|
return output;
|
||||||
|
};
|
||||||
|
|
||||||
|
// Make sure to return a promise
|
||||||
|
return {
|
||||||
|
getOverSoldStocks: await getOverSoldStocks(),
|
||||||
|
};
|
||||||
|
};
|
||||||
37
src/routes/list/oversold-stocks/+page.svelte
Normal file
37
src/routes/list/oversold-stocks/+page.svelte
Normal file
@ -0,0 +1,37 @@
|
|||||||
|
<script lang="ts">
|
||||||
|
import Table from "$lib/components/Table/Table.svelte";
|
||||||
|
|
||||||
|
export let data;
|
||||||
|
|
||||||
|
const defaultList = [
|
||||||
|
{ name: "RSI", rule: "rsi" },
|
||||||
|
{ name: "Price", rule: "price" },
|
||||||
|
{ name: "% Change", rule: "changesPercentage" },
|
||||||
|
{ name: "Market Cap", rule: "marketCap" },
|
||||||
|
];
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<section class="w-full overflow-hidden m-auto">
|
||||||
|
<div
|
||||||
|
class="w-full sm:flex sm:flex-row sm:items-center m-auto text-gray-100 border border-gray-800 sm:rounded-md h-auto p-5 mb-4"
|
||||||
|
>
|
||||||
|
<svg
|
||||||
|
class="w-5 h-5 inline-block sm:mr-2 flex-shrink-0"
|
||||||
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
viewBox="0 0 256 256"
|
||||||
|
><path
|
||||||
|
fill="#fff"
|
||||||
|
d="M128 24a104 104 0 1 0 104 104A104.11 104.11 0 0 0 128 24m-4 48a12 12 0 1 1-12 12a12 12 0 0 1 12-12m12 112a16 16 0 0 1-16-16v-40a8 8 0 0 1 0-16a16 16 0 0 1 16 16v40a8 8 0 0 1 0 16"
|
||||||
|
/></svg
|
||||||
|
>
|
||||||
|
|
||||||
|
A list of stocks that are "oversold" according to the Relative Strength
|
||||||
|
Index (RSI), which is an indicator often used in technical analysis. An RSI
|
||||||
|
of under 30 on a daily chart is generally used to determine that an asset is
|
||||||
|
oversold and indicates that the stock may soon bounce back from the oversold
|
||||||
|
conditions. See also the list of overbought stocks.
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Page wrapper -->
|
||||||
|
<Table {data} rawData={data?.getOverSoldStocks} {defaultList} />
|
||||||
|
</section>
|
||||||
26
src/routes/list/penny-stocks/+page.server.ts
Normal file
26
src/routes/list/penny-stocks/+page.server.ts
Normal file
@ -0,0 +1,26 @@
|
|||||||
|
export const load = async ({ locals, setHeaders }) => {
|
||||||
|
|
||||||
|
const getPennyStocks = async () => {
|
||||||
|
const { apiKey, apiURL } = locals;
|
||||||
|
const postData = { filterList: 'penny-stocks' };
|
||||||
|
|
||||||
|
const response = await fetch(apiURL + "/list-category", {
|
||||||
|
method: "POST",
|
||||||
|
headers: {
|
||||||
|
"Content-Type": "application/json",
|
||||||
|
"X-API-KEY": apiKey,
|
||||||
|
},
|
||||||
|
body: JSON.stringify(postData),
|
||||||
|
});
|
||||||
|
|
||||||
|
const output = await response.json();
|
||||||
|
setHeaders({ "cache-control": "public, max-age=60*5" });
|
||||||
|
|
||||||
|
return output;
|
||||||
|
};
|
||||||
|
|
||||||
|
// Make sure to return a promise
|
||||||
|
return {
|
||||||
|
getPennyStocks: await getPennyStocks(),
|
||||||
|
};
|
||||||
|
};
|
||||||
35
src/routes/list/penny-stocks/+page.svelte
Normal file
35
src/routes/list/penny-stocks/+page.svelte
Normal file
@ -0,0 +1,35 @@
|
|||||||
|
<script lang="ts">
|
||||||
|
import Table from "$lib/components/Table/Table.svelte";
|
||||||
|
|
||||||
|
export let data;
|
||||||
|
|
||||||
|
const defaultList = [
|
||||||
|
{ name: "Market Cap", rule: "marketCap" },
|
||||||
|
{ name: "Price", rule: "price" },
|
||||||
|
{ name: "% Change", rule: "changesPercentage" },
|
||||||
|
{ name: "Volume", rule: "volume" },
|
||||||
|
];
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<section class="w-full overflow-hidden m-auto">
|
||||||
|
<div
|
||||||
|
class="w-full sm:flex sm:flex-row sm:items-center m-auto text-gray-100 border border-gray-800 sm:rounded-md h-auto p-5 mb-4"
|
||||||
|
>
|
||||||
|
<svg
|
||||||
|
class="w-5 h-5 inline-block sm:mr-2 flex-shrink-0"
|
||||||
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
viewBox="0 0 256 256"
|
||||||
|
><path
|
||||||
|
fill="#fff"
|
||||||
|
d="M128 24a104 104 0 1 0 104 104A104.11 104.11 0 0 0 128 24m-4 48a12 12 0 1 1-12 12a12 12 0 0 1 12-12m12 112a16 16 0 0 1-16-16v-40a8 8 0 0 1 0-16a16 16 0 0 1 16 16v40a8 8 0 0 1 0 16"
|
||||||
|
/></svg
|
||||||
|
>
|
||||||
|
|
||||||
|
A list of actively traded penny stocks, which are generally defined as
|
||||||
|
stocks with a price below $5 per share. It is filtered to only show stocks
|
||||||
|
with volume over 10K.
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Page wrapper -->
|
||||||
|
<Table {data} rawData={data?.getPennyStocks} {defaultList} />
|
||||||
|
</section>
|
||||||
Loading…
x
Reference in New Issue
Block a user